效果图是这样的:
一个水平的layout中有3个ImageView 和3个 TextView,要使得三等分,每份里面ImageView和TextView居中。
主要用到 weight 属性 ,关于这个属性不了解的自行百度。
代码:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/relativeLayout3"
android:layout_centerVertical="true"
android:layout_marginTop="10dp"
android:background="@drawable/iread_operatebtn_bg"
android:orientation="horizontal" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_weight="1"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:orientation="horizontal"
android:layout_centerInParent="true">
<ImageView
android:id="@+id/iread_pin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/iread_pin" />
<TextView
android:id="@+id/iread_pinnum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:singleLine="true"
android:text="12"
android:textColor="#000000"
android:textSize="8sp" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_weight="1"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:orientation="horizontal"
android:layout_centerInParent="true">
<ImageView
android:id="@+id/iread_mark"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/iread_mark" />
<TextView
android:id="@+id/iread_marknum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:singleLine="true"
android:text="12"
android:textColor="#000000"
android:textSize="8sp" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_weight="1"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:orientation="horizontal"
android:layout_centerInParent="true">
<ImageView
android:id="@+id/iread_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/iread_comment" />
<TextView
android:id="@+id/iread_commentnum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:singleLine="true"
android:text="12"
android:textColor="#000000"
android:textSize="8sp" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>代码结构:
说明:
1:外层LinearLayout:
外层用到LinearLayout不用RelativeLayout,因为weight属性只在LinearLayout起作用。在中层的3个RelativeLayout中使用android:layout_weight="1"就可以使得三个RelativeLayout平分屏幕宽度。:
2:中层RelativeLayout:
容纳 内层LinearLayout,内层LinearLayout在它中设置属性为 center
3:内层LinearLayout:
无间隔的放置 一个ImageView和一个TextView
注:
注意代码中ImageView引用图片 要使用src 不能用background,否则图片会被拉伸平铺。
本文介绍如何使用LinearLayout和RelativeLayout实现水平三等分布局,并确保ImageView和TextView居中显示。通过合理运用weight属性,使得每个部分都能平均分配屏幕空间。

被折叠的 条评论
为什么被折叠?



