Android Design Support Library概览

Posted 2020-08-18

尊重劳动成果。转载请注明出处：http://blog.csdn.net/growth58/article/details/47972467
关注新浪微博：@于卫国
邮箱：[email protected]

简单介绍

在Google I/O 2015大会中，Google为android开发人员介绍了Design Support Library。

这个library能够让开发人员非常easy地实现很多其他Material Design概念到他们的应用中，由于非常多关键元素是不可用的在原来的框架外。

首先就是非常易于使用，Design Support Library向下兼容到API 7。Design Support Library能够引入到你的Androidproject中通过导入Gradle依赖。

compile ‘com.android.support:design:22.2.0‘

视觉组件
在Design支持库中有两个主要类别的工具：

• 视觉组件
• 动作组件

我们先看看有哪些新的视觉组件能够应用到你的App上。

Material Text Input

EditText自从最開始就已经在Android中了，而且使用非常简单，他们一直没有什么改变。使用Design Support Library。Google已经介绍了新的包括容器叫作TextInputLayout。

这个新的view加入功能到标准的EditText上。比如支持让你的用户界面弹出错误消息和动画提示。

正如以下的代码所看到的。TextInputLayout 能够包括在你的布局文件里包裹一个标准的EditText。

<android.support.design.widget.TextInputLayout
    android:id="@+id/textinput"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <EditText
        android:id="@+id/edittext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="What is your name?
" />

</android.support.design.widget.TextInputLayout>

Gianluca Segato 会带着你学习TextInputLayout 组件的使用在教程中。

Floating Action Buttons

在Material Design 应用中最占优势的用户界面组件之中的一个就是Floating Action Buttons。

自从他们的介绍后，开发人员不得不从头開始创建这些button或者是从非常多第三方设计的类库特别是这些button相关的选择一个。

使用Design 支持库，floating action buttons能够包括在一个布局中而且挂靠在屏幕的一部分用简单几行代码。每一个button都能够用icons和colors非常easy地进行自己定义。能够使用两个sizes 。standard (56dp) 和 mini (40dp)。最大的优势之中的一个是Google已经支持这些button作为他们的设计演变。

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="16dp"
    android:src="@drawable/ic_fab" />

导航组件

当ViewPager 和DrawerLayout 组件通过v4 support library可用时，Google已经对其进行了扩展通过提供两个新的相关的部件。第一个是官方版本号经常使用的ViewPagerIndicator library由Jake Wharton开发称为TabLayout。第二个是NavigationView。提供drawer header的支持。

TabLayout

TabLayout组件能够用代码使用addTab方法手动加入内容。

看看以下的样例。

tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));

另外，你能够将TabLayout和ViewPager组件进行关联。通过调用setupWithViewPager()能够完毕，使用ViewPager作为參数。

这是还有一种方式切换ViewPager的页面。应该注意的是getPageTitle()须要被重写当使用TabLayout和ViewPager时给每一个Tab一个合适的名称。

NavigationView

NavigationView是一个新的部件继承了DrawerLayout的功能。

开发人员使用这个组件能非常easy地加入头布局到drawer 和标记已选择的部分。

除此之外。它如今能够通过菜单资源文件非常简单地创建sections和subsections在drawer 中。

一个NavigationView须要和一个DrawerLayout进行关联在XML文件里。

<android.support.v4.widget.DrawerLayout      xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:fitsSystemWindows="true">

    <include layout="@layout/content"/>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_height="match_parent"
        android:layout_width="wrap_content"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/drawer_view"/>

</android.support.v4.widget.DrawerLayout>

增强的Toasts

Toast消息成为Android中基本的功能已经多年。一个新的用户界面部件叫作Snackbar可用于提供类似功能但改善了外观。Snackbar 不仅能给用户提示短时间的信息。它还支持一个动作加入到上下文中基于你的应用的功能而且能够使用手势滑掉使其消失。

Snackbar 比Toast功能有所增强，使用它须要注意的是须要创建一个能够被用来找到应用显示的最底部的View。

Snackbar.make( view, "Action", Snackbar.LENGTH_LONG )
    .setAction("Action!", new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Log.e("App", "Action!");
        }
    } )
    .show();

动作组件

一个用户界面特效和动画在Material Design中是非常重要的。为了促进这个，Googlen已经公布了多个常见用例的组件在Design支持库中。Kerry Perez-Huanca将会在教程中带着大家学习Design支持库中的这方面的组件。

Reactive Views

你可能已经注意到了在之前样例中的FloatingActionButton会在Snackbar出现的时候向上移动。这是用一个新的部件叫作CoordinatorLayout完毕的。用它包裹的view应该给其他view留出空间。

改善Quick Return and Toolbars

非常多开发人员询问用最简单的方式显示一个视差图片作用于高速返回设计模式。随着用户上下滑动而出现或消失。

你能够在Play Store的应用列表看到这个效果。为了让开发人员实现这个功能不用写大量冗余代码，Google公布了CollapsingToolBarLayout 和AppBarLayout views。在这些部件里使用不同的选项，开发人员能固定views在屏幕的顶部或特定的位置当这些views应该随着用户滑动显示时。

总结

Design 支持库带来了大量期待已久的工具在Android上。当它和AppCompat 库配合使用时。它变得非常easy地加入Material Design到应用上而且保持向下兼容。

能够在Google官方相关的应用上找到这些新组件是如何工作的非常多样例，CheeseSquare，Tuts+将会继续提供深入教程在如何实现这些新特征上。

请我喝杯咖啡，请使用支付宝扫描下方二维码：

原文地址：http://code.tutsplus.com/articles/overview-of-the-android-design-support-library–cms-24234