
@H_502_2@ Material Design简介
Material Design是谷歌新的设计语言,谷歌希望寄由此来统一各种平台上的用户体验,Material Design的特点是干净的排版和简单的布局,以此来突出内容。
Material Design对排版、材质、配色、光效、间距、文字大小、交互方式、动画轨迹都做出了建议,以帮助设计者设计出符合Material Design风格的应用。
Material Design设计语言鼓励大家使用充满活力的鲜艳色彩,并在同一界面建议使用三种色调,并保障有一个强色调,强色一般处于处于视图最底层,例如状态栏或者actionbar。通过强色调形成鲜明的对比,更容易突出内容的重要性。对于文字色彩的取值,Material Design建议在浅色背景上采用黑色,在深色背景上采用白色。重要信息和标题采用87%透明度,次要文字采用54%透明度,而更次要的说明文字可以采用26%的透明度。对于想特别突出或者可点击的文字,建议使用强色调。不同层级的视图,可以通过阴影来凸显。对于带有 *** 作且内容突出的区域,可以使用cardvIEw进行隔离,对于内容不太重要或者 *** 作比较单一的区域,可以使用分割线进行隔离。
最近项目中需要用到Material Design,整理了下面几个常用的控件,以便记忆。
@H_502_2@一、Snackbar
1.作用:与Toast类似,但是可以点击监听;
2.使用:
(1)Snackbar调用静态类make(),传入三个参数:VIEw父组件,文本,显示时间;
(2)Snackbar调用setAction(),传入两个参数:文本,点击监听事件实现OnClickListener接口;
(3)显示show()与隐藏dismiss();
@H_502_2@二、TextinputLayout
1.作用:包裹在EditText外边,可以将文本在EditText上方提示,同时可以设置错误提示;
2.使用:
(1)TextinputLayout对象调用setErrorEnable(),传入boolean类型参数表示是否显示错误信息;
(2)TextinputLayout对象调用SetError(),设置错误信息;
@H_502_2@三、floationgActionbutton
1.作用:悬浮在页面上方的按钮;
2.特有属性:
app:elevation="5dp" //阴影效果
app:pressedTranslationZ="10dp" //按压时显示效果
app:ripplecolor="@color" //颜色
@H_502_2@四、DrawerLayout
1.作用:作为布局的子布局,实现左右两侧的侧滑效果,用于添加菜单;
2.使用:(1)以DraweLayout作为根布局,内部可以包含三个及三个以下布局;
(2)为作为菜单的布局设置androID:layout_gravity属性,在左侧显示值为”left”,在右侧显示值为”right”;
(3)动态打开或关闭DrawerLayout中的布局:
DraweLayout对象调用openDrawer(),传入Gravity.left或者Gravity.Right两种参数值打开关闭布局;
DrawerLayout对象调用closeDrawer(),传入两种参数值关闭布局;
@H_502_2@五、NavigationVIEw
1.作用 :作为导航栏或者菜单栏的Menu视图添加;
2.使用:(1)静态属性:app:headerLayout添加头布局文件;
(2)静态属性:app:menu添加菜单文件;
(3)设置头视图监听:
(3-1)得到头视图:NavigationVIEw对象调用getheaderVIEw(),传入索引号0;
注意:如果没有getheaderVIEw(),可以使用findVIEwByID()得到头视图;
(3-2)找控件:头视图调用findVIEwByID()得到头视图中的控件;
(3-3)设置监听事件:得到的控件调用setonClickListener();
(4)设置menu按钮监听:
NavigationVIEw对象调用setNavigationItemSelectedListener(),
传入NavigationVIEw. OnNavigationVIEwIntemSelectedListener接口,
重写onNavigationItemSelected()接口;
@H_502_2@六、TabLayout
1.作用:与VIEwPager结合,达到联动导航效果;
2. 静态属性:
1 app:tabIndicatorcolor="@color/colorAccent"
2 app:tabIndicatorHeight="5dp"
3 app:tabSelectedTextcolor="@color/colorAccent"
4 app:tabTextcolor="#ffffff"
3.动态使用:
(1)声明并实例化TabLayout,VIEwPager;
(2)为VIEwPager控件设置适配器;
(3)设置Tablayout与VIEwPager的联动:
(3-1)TabLayout对象调用setupWithVIEwPager()传入要联动的VIEwPager对象;
(3-2)在自定义viewPager的适配器中,重写getPageTitle(),返回当前标题;
(3-3)TabLayout对象调用setTabMode(),传入TabLayout.MODE_SCRolLABLE常量,设置TabLayout的滚动;
@H_502_2@七、nestedScrollVIEw
1.作用:替代ScrollVIEw;
2.使用:与ScrollVIEw相同,内部只能有一个子控件;
@H_502_2@八、Toolbar
1.作用:
注意:使用Toolbar时必须将该Activity的主题设置为NoActionbar属性值;
2.使用:Toolbar控件必须放在AppbarLayout控件中,而AppbarLayout最好放在CoordinatorLayout控件(协同布局)中;
3.静态属性:
1 app:layout_scrollFlags=”scroll|enteralways” //Toolbar控件中,设置滑动响应事件;
2 app:Title=”” //为Toolbar设置标题名;
3 app:layout_behavior="@string/appbar_scrolling_vIEw_behavior" //nestedScrollVIEw控件中,设置控件行为
4.动态方法:
(4-1)声明并实例化Toolbar控件实例;
(4-2)将Actionbar设置为Toolbar:在当前Activity中调用setSupportActionbar(),传入新创建的Toolbar对象;
(4-3)当前Activity主题修改为NoActionbar模式:在清单文件中设置当前Activity标签下的属性androID:theme="@style/theme.AppCompat.NoActionbar";
注意:只有当前Activity主题为NoActionbar时,才会显示Toolbar;
九、CollapsingToolbar
1.作用:实现Toolbar的折叠效果;
2.使用:
CollapsingToolbar必须放在AppbarLayout中,
而AppbarLayout最好放在协同布局CoordinatorLayout控件中;
而Toolbar作为CollapsingToolbar的不折叠控件使用;
注意:CollapsingToolbar控件之下必须有且只有两个控件;
3.静态属性:
app:Title=”标题” //设置标题内容app:layout_scrollFlags="scroll|exitUntilCollapsed" //设置滚动标记app:expandedTitleGravity="right|bottom" //设置标题位置app:expandedTitlemarginBottom="@dimen/activity_vertical_margin" //设置标题到底部的距离app:expandedTitlemarginEnd="@dimen/activity_horizontal_margin" //设置标题距底部的距离app:contentScrim="#00ff00" //设置折叠时上方控件的颜色//注意:下边两条属性必须设置;app:layout_collapseMode="parallax" //在其需要被折叠的子控件中;app:layout_collapseMode="pin": //在需要留下来的子控件中;
4.动态设置:
//(1)设置展开状态下标题颜色collapsingToolbarLayout.setExpandedTitlecolor(color.WHITE);//(2)设置折叠后标题颜色collapsingToolbarLayout.setCollapsedTitleTextcolor(color.BLUE);
以上所述是小编给大家介绍的AndroID5.0中Material Design的新特性,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程小技巧网站的支持!
总结以上是内存溢出为你收集整理的Android5.0中Material Design的新特性全部内容,希望文章能够帮你解决Android5.0中Material Design的新特性所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)