安卓界面之Toolbar+tablayout+viewpager仿WhatsApp界面样式
2024-10-10 04:37:33
实现界面:
布局代码:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:gravity="center"
android:elevation="0dp"
app:elevation="0dp"
android:id="@+id/appbar_id"
>
<android.support.v7.widget.Toolbar
android:id="@+id/tb_id"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:background="?attr/colorPrimary"
app:titleTextColor="@color/colorwhite"
app:layout_scrollFlags="enterAlways"
/>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMaxWidth="0dp"
app:tabGravity="fill"
app:tabMode="fixed"
android:id="@+id/tablayout_id"
android:textAlignment="center"
app:tabTextAppearance="@style/tabtextsize"
app:tabSelectedTextColor="@color/tabindicatorcolor"
app:tabTextColor="@color/tabtextcolor"
app:tabIndicatorColor="@color/tabindicatorcolor"
android:background="@color/colorPrimary"/>
</android.support.design.widget.AppBarLayout> <!--设置fillViewport属性为true使viewpager可见-->
<!--包含可滑动的布局内容(RecyclerView,NestedScrollView,不支持ListView,ScrollView,ViewPager),但是可以在NestedScrollView中使用
必须要设置app:layout_behavior="@string/appbar_scrolling_view_behavior" (布局行为)
属性来告知CoordinatorLayout该组件是带有滑动行为的组件,
然后CoordinatorLayout在接受到滑动时会通知AppBarLayout中可滑动的Toolbar可以滑出屏幕-->
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:fillViewport="true"
>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/viewpager_id">
</android.support.v4.view.ViewPager>
</android.support.v4.widget.NestedScrollView> </android.support.design.widget.CoordinatorLayout>
</android.support.constraint.ConstraintLayout>
注意事项:
1.Toolbar和Tablayout要用AppBarLayout包裹,否则无法正确显示,我就出现了重叠的现象
2.在打代码过程中还发现Toolbar被AppBarLayout包裹后,还要用CoordinatorLayout包裹,否则toobar菜单无法点击.
3.TabLayout让文字平铺(居中)以及改变字体大小
https://blog.csdn.net/wangxinrun06/article/details/78249400
最新文章
- 说一说python的牛比与不爽
- 使用React并做一个简单的to-do-list
- BZOJ-1002 轮状病毒 高精度加减+Kirchhoff矩阵数定理+递推
- resharper安装后,一不小心点错了(选择了object browser)
- 本地电脑localhost指向127.0.0.1的配置
- iphone dev 入门实例6:How To Use UIScrollView to Scroll and Zoom and Page
- UML的9种图例解析
- JavaScript之Cookie讲解
- Spring DI模式 小样例
- 搭建solr单机版
- C#模拟登录总结
- Thread和Runnable的区别
- s21day15 python笔记
- 修改Linux主机名
- 码云平台IDEA系列的插件使用
- windows go dll 框架
- (转)android拨打电话崩溃6.0以上实时动态权限申请
- php连接微软MSSQL(sql server)完全攻略
- 百度jQuery库
- 【留用】C#的一些好的书籍