玩转android5.0控件

最新推荐文章于 2022-07-11 07:35:00 发布

yinbucheng

最新推荐文章于 2022-07-11 07:35:00 发布

阅读量275

点赞数

一个Activity掌握Android5.0新控件（转）

原文地址：http://blog.csdn.net/lavor_zl/article/details/51279386
谷歌在推出Android5.0的同时推出了一些新控件，Android5.0中最常用的新控件有下面5种。

1. CardView（卡片视图）

CardView顾名思义是卡片视图，它继承FrameLayout。它是一个带圆角的背景和阴影FrameLayout。CardView被包装为一种布局，并且经常在ListView和RecyclerView的Item布局中，作为容器使用。
CardView的使用非常简单：

<code class="hljs avrasm has-numbering">    <android<span class="hljs-preprocessor">.support</span><span class="hljs-preprocessor">.v</span>7<span class="hljs-preprocessor">.widget</span><span class="hljs-preprocessor">.CardView</span>
        android:layout_width=<span class="hljs-string">"match_parent"</span>
        android:layout_height=<span class="hljs-string">"60dp"</span>>
        <Button
            android:id=<span class="hljs-string">"@+id/ripple_button"</span>
            android:layout_width=<span class="hljs-string">"match_parent"</span>
            android:layout_height=<span class="hljs-string">"50dp"</span>
            android:layout_gravity=<span class="hljs-string">"center"</span>
            android:layout_margin=<span class="hljs-string">"5dp"</span>
            android:background=<span class="hljs-string">"@drawable/ripple"</span>
            android:gravity=<span class="hljs-string">"center"</span>
            android:text=<span class="hljs-string">"我在一个CardView里面"</span> />
    </android<span class="hljs-preprocessor">.support</span><span class="hljs-preprocessor">.v</span>7<span class="hljs-preprocessor">.widget</span><span class="hljs-preprocessor">.CardView</span>>  </code>

2. Patelle（调色板）

Patelle是一个辅助类，它的作用是从图片中获取突出的颜色。
它可以提取下面几种特性的突出颜色：
- Vibrant（充满活力的）
- Vibrant Dark（充满活力，黑暗的）
- Vibrant Light（充满活力的，明亮的）
- Muted（柔和的）
- Muted Dark（柔和的，黑暗的）
- Muted Light（柔和的，明亮的）

Patelle的使用也非常简单：

<code class="hljs avrasm has-numbering">        // 获取应用程序图标的Bitmap
        bitmap= BitmapFactory<span class="hljs-preprocessor">.decodeResource</span>(getResources(), R<span class="hljs-preprocessor">.mipmap</span><span class="hljs-preprocessor">.ic</span>_launcher)<span class="hljs-comment">;</span>
        // 通过bitmap生成调色板palette
        Palette palette=Palette<span class="hljs-preprocessor">.from</span>(bitmap)<span class="hljs-preprocessor">.generate</span>()<span class="hljs-comment">;</span>
        // 获取palette充满活力色颜色
        int vibrantColor=palette<span class="hljs-preprocessor">.getVibrantColor</span>(Color<span class="hljs-preprocessor">.WHITE</span>)<span class="hljs-comment">;  </span></code>

3. Toolbar（工具栏）

Toolbar顾名思义是工具栏，作为ActionBar的替代品出现，谷歌推荐使用Toolbar替代ActionBar。
Toolbar可以放置在任何地方，不像ActionBar一样只能放置在固定的位置。
Toolbar支持比ActionBar更集中的特征。
Toolbar可能包含以下可选元素的组合：
- 导航按钮
- 品牌的Logo图像
- 标题和子标题
- 一个或多个自定义视图

<code class="hljs avrasm has-numbering">        this<span class="hljs-preprocessor">.toolbar</span> = (Toolbar) findViewById(R<span class="hljs-preprocessor">.id</span><span class="hljs-preprocessor">.toolbar</span>)<span class="hljs-comment">;</span>
        this<span class="hljs-preprocessor">.recyclerview</span> = (RecyclerView) findViewById(R<span class="hljs-preprocessor">.id</span><span class="hljs-preprocessor">.recycler</span>_view)<span class="hljs-comment">;</span>
        this<span class="hljs-preprocessor">.ripplebutton</span> = (Button) findViewById(R<span class="hljs-preprocessor">.id</span><span class="hljs-preprocessor">.ripple</span>_button)<span class="hljs-comment">;</span>
        this<span class="hljs-preprocessor">.button</span> = (Button) findViewById(R<span class="hljs-preprocessor">.id</span><span class="hljs-preprocessor">.button</span>)<span class="hljs-comment">;</span>
        // 设置Logo
        toolbar<span class="hljs-preprocessor">.setLogo</span>(R<span class="hljs-preprocessor">.mipmap</span><span class="hljs-preprocessor">.ic</span>_launcher)<span class="hljs-comment">;</span>
        // 设置标题
        toolbar<span class="hljs-preprocessor">.setTitle</span>(<span class="hljs-string">"Android5.0"</span>)<span class="hljs-comment">;</span>
        // 设置子标题
        toolbar<span class="hljs-preprocessor">.setSubtitle</span>(<span class="hljs-string">"新控件"</span>)<span class="hljs-comment">;</span>
        //设置ActionBar，之后就可以获取ActionBar并进行操作，操作的结果就会反应在toolbar上面
        setActionBar(toolbar)<span class="hljs-comment">;</span>
        //设置了返回箭头,，相当于设置了toolbar的导航按钮
        getActionBar()<span class="hljs-preprocessor">.setDisplayHomeAsUpEnabled</span>(true)<span class="hljs-comment">;  </span></code>

4. RippleDrawable（波纹图）

RippleDrawable顾名思义是波纹图，只能在Android5.0以上使用，目前还没有提供RippleDrawable向下兼容的支持包。
RippleDrawable可显示一个涟漪效应响应状态变化。
定义一个UI的背景图片为RippleDrawable
android:background="@drawable/ripple"
在drawable文件夹下面定义一个RippleDrawable的xml文件

<code class="hljs xml has-numbering"><span class="hljs-pi"><?xml version="1.0" encoding="utf-8"?></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><<span class="hljs-title">ripple</span> <span class="hljs-attribute">xmlns:android</span>=<span class="hljs-value">"http://schemas.android.com/apk/res/android"</span><span class="hljs-attribute">android:color</span>=<span class="hljs-value">"#0000FF"</span>></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><span style="font-family:Helvetica, 'Hiragino Sans GB', 微软雅黑, 'Microsoft YaHei UI', SimSun, SimHei, arial, sans-serif;line-height: 1.6;">    </span><<span class="hljs-title">item</span>></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><span style="font-family:Helvetica, 'Hiragino Sans GB', 微软雅黑, 'Microsoft YaHei UI', SimSun, SimHei, arial, sans-serif;line-height: 1.6;">    </span><<span class="hljs-title">shape</span> <span class="hljs-attribute">android:shape</span>=<span class="hljs-value">"rectangle"</span>></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><span style="font-family:Helvetica, 'Hiragino Sans GB', 微软雅黑, 'Microsoft YaHei UI', SimSun, SimHei, arial, sans-serif;line-height: 1.6;">    </span><<span class="hljs-title">solid</span> <span class="hljs-attribute">android:color</span>=<span class="hljs-value">"#FFFFFF"</span> /></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><span style="font-family:Helvetica, 'Hiragino Sans GB', 微软雅黑, 'Microsoft YaHei UI', SimSun, SimHei, arial, sans-serif;line-height: 1.6;">    </span><<span class="hljs-title">corners</span> <span class="hljs-attribute">android:radius</span>=<span class="hljs-value">"4dp"</span> /></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><span style="font-family:Helvetica, 'Hiragino Sans GB', 微软雅黑, 'Microsoft YaHei UI', SimSun, SimHei, arial, sans-serif;line-height: 1.6;">    </span></<span class="hljs-title">shape</span>></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"><span style="font-family:Helvetica, 'Hiragino Sans GB', 微软雅黑, 'Microsoft YaHei UI', SimSun, SimHei, arial, sans-serif;line-height: 1.6;">    </span></<span class="hljs-title">item</span>></span></code>

<code class="hljs xml has-numbering"><span class="hljs-tag"></<span class="hljs-title">ripple</span>></span>  </code>

android:color ：表示波纹的颜色
<item>：表示波纹图下面的条目

来看一下点击按钮的波纹效果

5. RecyclerView（循环视图）

RecyclerView是ListView的替代品，谷歌推荐使用RecyclerView替代ListView。
RecyclerView提供比ListView更加灵活的使用，并且性能比ListView更优。
RecyclerView可以设置线性，网格，瀑布流式三种布局管理器。
- LinearLayoutManager（线性布局管理器）
- GridLayoutManager（网格布局管理器）
- StaggeredGridLayoutManager（瀑布流式布局管理器）

RecyclerView的简单使用：

<code class="hljs cpp has-numbering">        <span class="hljs-keyword">this</span>.recyclerview = (RecyclerView) findViewById(R.id.recycler_view);
        <span class="hljs-comment">//新建一个线性布局管理器</span>
        LinearLayoutManager manager=<span class="hljs-keyword">new</span> LinearLayoutManager(<span class="hljs-keyword">this</span>);
        <span class="hljs-comment">//设置recyclerview的布局管理器</span>
        recyclerview.setLayoutManager(manager);
        <span class="hljs-comment">//新建适配器</span>
        RecyclerViewAdapter adapter=<span class="hljs-keyword">new</span> RecyclerViewAdapter(<span class="hljs-keyword">this</span>,<span class="hljs-built_in">list</span>);
        <span class="hljs-comment">//设置recyclerview的适配器</span>
        recyclerview.setAdapter(adapter);</code>

RecyclerView适配器的定义：

<code class="hljs php has-numbering"><span class="hljs-keyword">public</span> <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">RecyclerViewAdapter</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">RecyclerView</span>.<span class="hljs-title">Adapter</span><<span class="hljs-title">RecyclerViewAdapter</span>.<span class="hljs-title">MyHolder</span>>{</span><span class="hljs-keyword">private</span> Context context;
    <span class="hljs-keyword">private</span> <span class="hljs-keyword">List</span><String> <span class="hljs-keyword">list</span>;
    <span class="hljs-keyword">public</span> RecyclerViewAdapter(Context context) {
        this.context = context;
    }
    <span class="hljs-keyword">public</span> RecyclerViewAdapter(Context context, <span class="hljs-keyword">List</span><String> <span class="hljs-keyword">list</span>) {
        this.context = context;
        this.<span class="hljs-keyword">list</span> = <span class="hljs-keyword">list</span>;

    }
    @Override
    <span class="hljs-keyword">public</span> MyHolder onCreateViewHolder(ViewGroup <span class="hljs-keyword">parent</span>, int viewType) {
        MyHolder holder=<span class="hljs-keyword">new</span> MyHolder(LayoutInflater.from(context).inflate(R.layout.adapter_recycler_view,<span class="hljs-keyword">parent</span>,<span class="hljs-keyword">false</span>));
        <span class="hljs-keyword">return</span> holder;
    }
    @Override
    <span class="hljs-keyword">public</span> void onBindViewHolder(MyHolder holder, int position) {
        holder.textView.setText(<span class="hljs-keyword">list</span>.get(position));

    }
    @Override
    <span class="hljs-keyword">public</span> int getItemCount() {
        <span class="hljs-keyword">return</span> <span class="hljs-keyword">list</span>.size();
    }
    <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">MyHolder</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">RecyclerView</span>.<span class="hljs-title">ViewHolder</span>{</span><span class="hljs-keyword">private</span> TextView textView;
        <span class="hljs-keyword">public</span> MyHolder(View itemView) {
            super(itemView);
            textView= (TextView) itemView.findViewById(R.id.text);
        }
    }
}</code>

6. 一个Activity掌握Android5.0新控件

为了方便学习，本人将这5个新控件放到一个Activity中进行使用。

程序原始界面讲解
点击“设置…”按钮，获取应用程序图标的充满色彩的颜色，并将该颜色设置为Toolbar的背景颜色。
点击“我在…”按钮，会出现波纹效果，因为按钮的背景图片是RippleDrawable，而此时按钮状态又发生了变化。

注意：RecyclerView，Patelle，CardView是在单独的支持包里面，不在appcompat-v7及其依赖子包中
要使用它们，必须导入它们的依赖包

<code class="hljs bash has-numbering">    compile <span class="hljs-string">'com.android.support:recyclerview-v7:23.1.1'</span>
    compile <span class="hljs-string">'com.android.support:palette-v7:23.1.1'</span>
    compile <span class="hljs-string">'com.android.support:cardview-v7:23.1.1'</span>  </code>

本程序源代码下载一个Activity掌握Android5.0新控件