UI篇--android实现底部按钮布局
1.采用LinearLayout布局:
<LinearLayout android:id="@+id/main" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <LinearLayout android:id="@+id/content" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1" android:orientation="vertical" /> <LinearLayout android:id="@+id/bottom_panel" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/done" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" android:text="done" /> <Button android:id="@+id/revert" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" android:text="revert" /> </LinearLayout> </LinearLayout>
或者:
<?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:gravity="clip_horizontal" android:layout_height="fill_parent" android:id="@+id/toplayout"> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="30dip" android:background="@drawable/header" android:gravity="center"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/toptv" android:gravity="center" android:textSize="20dip" android:layout_gravity="center" android:text="@string/home"/> </LinearLayout> <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="wrap_content" android:gravity="center" android:textSize="20dip" android:layout_gravity="center" android:text="@string/home" android:layout_height="fill_parent"/> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_marginTop="-50dip" android:layout_height="50dip" android:gravity="bottom" android:background="@drawable/header"> <include layout="@layout/foot" /> </LinearLayout> </LinearLayout>
2. 采用relativelayout布局:
android实现底部布局往往使用RelativeLayout的布局方式,并且设置android:layout_alignParentBottom=”true”,这样很容易实现底部布局。然而对于比较复杂的布局简单的属性设置无法达到这样的效果,例如top,center,bottom三层的布局,很可能因为中间层(center)的数据太多而将无法显示全或者将bottom层挤下去。解决这个问题,在采用RelativeLayout布局时,除了设置android:layout_alignParentBottom=”true”外,还需要对中间层进行属性进行设置:android:layout_above=”@id/bottom”
android:layout_below=”@id/top”。这样的设置即确保center层能处于中间位置,也可以通过自适应显示滚动条。
以下的例子就是实现三层布局的底部布局的功能。如图1,2。
图-1 三层的底部布局界面
图 2 弹出输入法时显示的底部按钮
项目只是实现主要的数据填充及布局,故只是简单的文件加载。以下是源码:
1.BottomTestActivity.java
主要布局文件
2.main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical"> <RelativeLayout android:id="@+id/wrap1" android:layout_width="fill_parent" android:layout_height="wrap_content" > <LinearLayout android:id="@+id/top" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <EditText android:id="@+id/view_user_input" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="6dip" android:layout_marginLeft="12dip" android:singleLine="true" android:numeric="integer" android:imeOptions="actionDone" android:hint="输入用户ID" android:layout_weight="1"/> <Button android:id="@+id/view_user" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="4dip" android:layout_weight="3" android:text="查看"/> </LinearLayout> <LinearLayout android:id="@+id/center" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical" android:layout_above="@id/bottom" android:layout_below="@id/top" > <TextView android:id="@+id/my_friends_list" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="好友列表" android:paddingTop="6dip" android:paddingLeft="2dip" android:layout_marginLeft="10dip"/> <ListView android:id="@+id/friends" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="6dip"/> </LinearLayout> <LinearLayout android:id="@+id/bottom" android:background="@drawable/bg" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_alignParentBottom="true" > <Button android:id="@+id/refresh" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="2dip" android:text="刷新用户列表" android:layout_weight="1"/> <Button android:id="@+id/back" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="2dip" android:text="返回" android:layout_weight="1"/> </LinearLayout> </RelativeLayout> </LinearLayout>
listview item内容的布局文件
3.item.xml
源码下载:BottomTest.zip
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。