Android5.x 学习

来源：互联网发布：软件测试基础理论知识编辑：程序博客网时间：2024/05/24 07:21

Material Design

Material Design是Android 5.0系统的重头戏所以这里教大家怎么将Material Design引入到自己的项目中官方也有相关的Blog 点击打开链接

下面就来给大家介绍一些新的特性

elevation和translationZ属性

Materials为了更好的响应用户的操作动作提供了一个z轴的概念所谓z轴也就是相对使用者对控件的垂直方向利用对elevation和 translationZ属性的调节可以实现一个控件浮起和底部的阴影效果

可以看到上面的控件有一个阴影的效果和点击时候有一个上浮的效果下面介绍代码的编写

elevation和translationZ可以理解成elevation是设定的一个固定值而translationZ则是z轴上的一个动作

elevation只需在xml中添加elevation属性并设定对应的高度

 android:elevation="5dp"这里则是代表z轴上的高度为5不同的高度会产生不同的阴影效果

translationZ的使用:下面是给view设置一个z轴的运动当点击时z轴上浮300f运动结束后z轴高度回到5f

    View.setmListener(new View.OnClickListener() {            @TargetApi(Build.VERSION_CODES.LOLLIPOP)            @Override            public void onClick(final View v) {                v.animate().translationZ(300F).setDuration(300).setListener(new AnimatorListenerAdapter() {                    @Override                    public void onAnimationEnd(Animator animation) {                        super.onAnimationEnd(animation);                        v.animate().translationZ(5f).setDuration(500).start();                    }                }).start();            }        });

CardView 的使用：

在android5.x上Google也提供了CardView控件CardView也是一个容器类布局它是以卡片的形式展现开发者可以设置卡片的大小和设置圆角的角度同时CardView也和上面

介绍的关于z轴的使用一样拥有对自己z轴的设置从而实现阴影的效果使用CardView需要在项目中引入

   compile 'com.android.support:cardview-v7:21.+'的依赖可以通过cardBackgroundColor和cardCornerRadius来设置CardView的背景颜色和圆角的角度

代码如下：

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:card_view="http://schemas.android.com/apk/res-auto"    android:id="@+id/cardview"    android:layout_margin="5dp"    android:elevation="5dp"    card_view:cardBackgroundColor="@color/primary"    card_view:cardCornerRadius="5dp"    android:layout_width="250dp"    android:layout_height="250dp"></android.support.v7.widget.CardView>

Ripple:

在android5.0中Material Design大量使用了Ripple效果即涟漪效果可以通过下面属性设置波纹

android:background="?android:attr/selectableItemBackgroundBorderless"//波纹超出边界

    android:background="?android:attr/selectableItemBackground"//波纹没有边界

也可以自己定义ripple：drawable-v21/ripple.xml

<ripple    xmlns:android="http://schemas.android.com/apk/res/android"    android:color="@color/primary"     >    <item>        <shape            android:shape="oval"            >            <solid android:color="?android:colorAccent"/>        </shape>    </item></ripple>

使用：设置控件的background属性：background="@drawable/ripple"

</pre><h2 id="Reveal" style="color: rgba(0, 0, 0, 0.870588); clear: left; font-size: 28px; font-weight: 400; line-height: 32px; margin: 24px 0px 0px; font-family: Roboto, sans-serif;">Reveal Effect</h2><div><span style="white-space:pre"></span>揭示动画提供了用户视觉连续性时显示或隐藏一组ui元素,ViewAnimationUtils.createCircularReveal()方法使你能够激活一个剪切循环显示或隐藏一个试图</div><p></p><p><span style="font-family:Consolas, Bitstream Vera Sans Mono, Courier New, Courier, monospace;"><span style="white-space: nowrap;"><span style="white-space:pre"><span style="color: rgb(67, 67, 67); font-family: Tahoma, Arial; line-height: 24px; widows: auto; background-color: rgb(242, 242, 242);"><span style="white-space:pre"><img src="http://img.blog.csdn.net/20151225140159592?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="200" height="250" alt="" /></span></span></span></span></span></p><p><span style="font-family:Consolas, Bitstream Vera Sans Mono, Courier New, Courier, monospace;font-size:14px;"><span style="white-space: nowrap;"><span style="white-space:pre"><span style="color: rgb(67, 67, 67); font-family: Tahoma, Arial; line-height: 24px; widows: auto; background-color: rgb(242, 242, 242);"><span style="white-space:pre"></span>效果展示的不是很好没有好的软件大家有的话可以推荐一个下面贴上代码</span></span></span></span></p><p><span style="font-family:Consolas, Bitstream Vera Sans Mono, Courier New, Courier, monospace;"><span style="white-space: nowrap;"><span style="white-space:pre"><span style="color: rgb(67, 67, 67); font-family: Tahoma, Arial; line-height: 24px; widows: auto; background-color: rgb(242, 242, 242);"><span style="white-space:pre"></span></span></span></span></span></p><pre name="code" class="java">btn_show.setOnClickListener(new View.OnClickListener() {            @TargetApi(Build.VERSION_CODES.LOLLIPOP)            @Override            public void onClick(View v) {                if(tv.getVisibility()==View.INVISIBLE){                    int cx=(tv.getLeft()+tv.getRight())/2;                    int cy=(tv.getTop()+tv.getBottom())/2;                    int finalRadius=Math.max(tv.getWidth(),tv.getHeight());                    Animator animator = ViewAnimationUtils.createCircularReveal(tv, cx, cy,0, finalRadius);                    tv.setVisibility(View.VISIBLE);                    animator.start();                }            }        });        btn_hide.setOnClickListener(new View.OnClickListener() {            @TargetApi(Build.VERSION_CODES.LOLLIPOP)            @Override            public void onClick(View v) {                if(tv.getVisibility()==View.VISIBLE){                    int cx=(tv.getLeft()+tv.getRight())/2;                    int cy=(tv.getTop()+tv.getBottom())/2;                    int initialRadius=tv.getWidth();                    Animator animator=ViewAnimationUtils.createCircularReveal(tv,cx,cy,initialRadius,0);                    animator.addListener(new AnimatorListenerAdapter() {                        @Override                        public void onAnimationEnd(Animator animation) {                            super.onAnimationEnd(animation);                            tv.setVisibility(View.INVISIBLE);                        }                    });                    animator.start();                }            }        });

Activity的过度动画和共享元素

android5.x提供了activity更加炫酷的进入和退出动画以及在两个页面之间共享元素做到更加友好的过度到第二个页面下面先来介绍activity的过度动画

进入和退出动画包含这三种:explode(分解),slide(滑动),fade(淡出)

下面为运行效果:

这卡的真的很蛋疼感兴趣可以下载我的项目运行看一下效果下面会提供下载地址

怎么使用activity的过度动画:

假如是activityA跳转到activityB

activityA:只需对startactivity（intent）做修改

 Intent intent= new Intent(TransitionAnimationsFragment.this.getActivity(),Bactivity.class);                intent.putExtra("flags",0);                TransitionAnimationsFragment.this.getActivity().startActivity(intent,                ActivityOptions.makeSceneTransitionAnimation((MainActivity) TransitionAnimationsFragment.this.getActivity()).toBundle());

activityB:只需设置:getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS),getWindow().setEnterTransition(new Fade)为设置进入activityb的

动画getWindow().setExitTransition(new Fade())为设置activityb的退出动画

 getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);switch (getIntent().getIntExtra("flags",0)){            case 0:               getWindow().setEnterTransition(new Explode());                getWindow().setExitTransition(new Explode());                break;            case 1:                getWindow().setEnterTransition(new Slide());                getWindow().setExitTransition(new Slide());                break;            case 2:                getWindow().setEnterTransition(new Fade());                getWindow().setExitTransition(new Fade());                break;        }

下面介绍共享元素的使用:假如activity1和activity2中拥有一张同样的照片只是照片的大小不同如果是以前的页面跳转会非常硬生的跳转到第二个页面所以android5.x提供了共享元素这一特征使用动画将图片过度到第二个页面显得更加友好

使用:只需要在activity1和activity2的布局文件中将两个图片控件设置属性transitionName=“share”注意两个布局文件的命名一定要相同这样系统才能找到共享元素

下面是具体代码

activity2:

 <ImageView        android:id="@+id/img"        android:transitionName="share"        android:background="@drawable/abc"        android:layout_width="200dp"        android:layout_height="200dp" />

activity1:

<ImageView        android:id="@+id/img"        android:transitionName="share"        android:background="@drawable/abc"        android:layout_width="100dp"        android:layout_height="100dp" />

Intent intent= new Intent(this,activity2.class); TransitionAnimationsFragment.this.getActivity().startActivity(intent,ActivityOptions.makeSceneTransitionAnimation(                        this,view,"share").toBundle());

当有多个共享元素时可以通过Pair.create()来创建多个共享元素

Intent intent= new Intent(this,activity2.class); TransitionAnimationsFragment.this.getActivity().startActivity(intent,ActivityOptions.makeSceneTransitionAnimation(                        this,Pair.create(view,"share"),                         Pair.create(view2,"share2")                        ).toBundle());

下面介绍Toolbar配合DrawerLayout(抽屉控件)使用

这里就不对toolbar做介绍了

下面为效果

可以看到上面最最左边的Toggle在DrawerLayout滑动时,会从三条横线变成一个箭头状的图案

其实很简单只需要进行下面代码的书写就可以了这里就不介绍DrawerLayout的布局书写了有需要的可以去下载我项目的源码

 getSupportActionBar().setDisplayHomeAsUpEnabled(true);        mActionBarDrawerToggle=new ActionBarDrawerToggle(this,mDrawerLayout,mToolbar,R.string.app_name,R.string.app_name){            @Override            public void onDrawerClosed(View drawerView) {                super.onDrawerClosed(drawerView);                invalidateOptionsMenu();            }            @Override            public void onDrawerOpened(View drawerView) {                super.onDrawerOpened(drawerView);                invalidateOptionsMenu();            }            @Override            public boolean onOptionsItemSelected(MenuItem item) {                return super.onOptionsItemSelected(item);            }        };        mActionBarDrawerToggle.syncState();;        mDrawerLayout.setDrawerListener(mActionBarDrawerToggle);

关于5.x本博客就介绍到这里了其实还有好多比如pathInterpolator插值器，StateListAnimator动画，animated-selector利用它可以实现控件在不同状态切换时拥有炫酷的动画效果比如我们熟悉的check_box的动画效果感兴趣的大家可以去官方的文档学习没有vpn的可以留言下面会献上项目的下载地址

1 0