关于WebVeiw的例子（一）-优快云博客

本文详细介绍了如何通过Android布局文件（main.xml、item.xml、grid.xml）实现图文并茂的展示效果，包括文本、编辑框、WebView及网格视图的集成与布局优化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果图如上：

首先，先把布局文件给大家：

先是main.xml

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/hello" /> <EditText android:hint="www.google.com.hk" android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/editText" /> <WebView android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/webView"></WebView> </LinearLayout>

然后是item.xml

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="wrap_content" android:paddingBottom="4dip" android:layout_width="fill_parent"> <ImageView android:layout_height="wrap_content" android:id="@+id/ItemImage" android:layout_width="wrap_content" android:layout_centerHorizontal="true"> </ImageView> <TextView android:layout_width="wrap_content" android:layout_below="@+id/ItemImage" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:id="@+id/ItemText"> </TextView> </RelativeLayout>

最后是一个很简单但是很重要grid.xml

<?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="wrap_content" android:layout_width="fill_parent" android:id="@+id/gridView" android:gravity="center" android:numColumns="auto_fit" android:verticalSpacing="10dp" android:horizontalSpacing="10dp" android:columnWidth="90dp" ></GridView>

要记住，不要把GridView写在一个Layout父控件下，不然的话就会报错，因为我们在java代码中是把GridView添加到WebView中，所以Gridview不能有父控件。

java代码如下：