android 学习笔记13-新特性Fragment 帧动画 补间动画 属性动画

1、Fragment的介绍

生命周期方法跟Activity一致,可以理解把其为就是一个Activity
用途:在一个Activity里切换界面,切换界面时只切换Fragment里面的内容
fragment切换时会销毁旧的,再创建新的
定义布局文件作为Fragment的显示内容

//此方法返回的View就会被显示在Fragment上
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
        //用布局文件填充成一个View对象,返回出去,那么就显示在Fragment上了
        View v = inflater.inflate(R.layout.fragment01, null);//ViewGroup root 父节点传一个null
        return v;     
    }

把Fragment显示至指定ViewGroup中
    //把fragment显示至界面
    Fragment01 fg = new Fragment01();//new出fragment对象
    FragmentManager fm = getFragmentManager();//获取fragment管理器
    FragmentTransaction ft = fm.beginTransaction();//开启事务
    ft.replace(R.id.fl, fg);//把fragment对象显示到指定资源id的组件里面
    ft.commit();//提交

代码演示:
MainActivity.java:
public class MainActivity extends Activity {
    @Override 
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        showfagment01();//显示一个默认的fragment
    }

    private void showfagment01() {
        Fragment01 fragment1 = new Fragment01();//1.创建fragment对象
        FragmentManager fm = getFragmentManager();//2.获取fragment管理器
        FragmentTransaction ft = fm.beginTransaction();//3.开启事务

        //arg0:设置把fragment显示在哪个容器中
        ft.replace(R.id.fl, fragment1);//4.显示fragment
        ft.commit();//5.提交
    }

    public void click1(View v){
        showfagment01();
    }
    public void click2(View v){
        Fragment02 fragment2 = new Fragment02();//1.创建fragment对象
        FragmentManager fm = getFragmentManager();//2.获取fragment管理器
        FragmentTransaction ft = fm.beginTransaction();//3.开启事务
        ft.replace(R.id.fl, fragment2);//4.显示fragment
        ft.commit();//5.提交
    }
}

Fragment01.java
public class Fragment01 extends Fragment {
    //系统自动调用,返回的View对象作为Fragment的内容显示
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.fragment01, null);
        return v;
    }
}

Fragment02.java
public class Fragment02 extends Fragment {
    //系统自动调用,返回的View对象作为Fragment的内容显示
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.fragment02, null);
        return v;
    }
}

activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" 
    android:orientation="horizontal"
    >
    <FrameLayout 
        android:id="@+id/fl"
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        ></FrameLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >
        <Button 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="界面1"
            android:onClick="click1"
            />
        <Button 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="界面2"
            android:onClick="click2"
            />
        </LinearLayout>
</LinearLayout>

fragment01.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" 
    android:background="#00ff00"
    >
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="这个fragment是绿色"
        />
</LinearLayout>

fragment02和上面类似

这样fragment的代码就演示完成了

2、Fragment向下兼容

因为fragment是新特性,如果想在低版本上面使用的话,就需要使用support-v4.jar包中有相关api 
生命周期:fragment切换时旧fragment对象会销毁,新的fragment对象会被创建
activity有7个生命周期,fragment有11个,调用顺序和activity差不多,多了关联和取消关联的步骤,具体的调用顺序可以在代码里面打印知道。

3、帧动画-FrameAnimation

需要定义每一帧的图片
多张图片快速切换,形成动画效果
在drawable目录下定义xml文件,子节点为animation-list,在这里定义要显示的图片和每张图片的显示时长
    <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">
        <item android:drawable="@drawable/g1" android:duration="200" />
        <item android:drawable="@drawable/g2" android:duration="200" />
        <item android:drawable="@drawable/g3" android:duration="200" />
    </animation-list>
播放动画
    ImageView iv = (ImageView) findViewById(R.id.iv);
    iv.setBackgroundResource(R.drawable.animations);//把动画文件设置为imageView的背景
    AnimationDrawable ad = (AnimationDrawable) iv.getBackground();
    ad.start();//播放动画 

具体的代码演示:
a,在drawable目录定义xml文件://一般创建工程没有这个文件夹,可以自己创建一下
animation.xml:
    <?xml version="1.0" encoding="utf-8"?>
    <animation-list xmlns:android="http://schemas.android.com/apk/res/android"
        android:oneshot="false">//这里的false就是循环播放,如果设置true就播放一次就停止
        <item android:drawable="@drawable/g1" android:duration="200" />
        <item android:drawable="@drawable/g2" android:duration="200" />
        <item android:drawable="@drawable/g3" android:duration="200" />
        <item android:drawable="@drawable/g4" android:duration="200" />
    </animation-list>

b,把资源图片文件放在drawable-hdpi 目录

c,main_activity.xml:
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity" >
        <ImageView
            android:id="@+id/iv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            />
    </RelativeLayout>

d,mainactivity.java:
    public class MainActivity extends Activity {
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);

             ImageView rocketImage = (ImageView) findViewById(R.id.iv);
             rocketImage.setBackgroundResource(R.drawable.animation);//设置iv的背景图
             AnimationDrawable rocketAnimation = (AnimationDrawable) rocketImage.getBackground();//获取iv的背景
             rocketAnimation.start();//开始播放
        }
    }

4、补间动画

无需逐一定义每一帧,只要定义开始、结束的帧,和指定动画持续时间
原形态变成新形态时为了过渡变形过程,生成的动画就叫补间动画

补间动画有4种(均为Animation抽象类子类)
透明:AlphaAnimation(透明度,0~1)
缩放:ScaleAnimation(大小缩放,X、Y轴缩放,还包括缩放中心pivotX、pivotY)
位移:TranslationAnimation(位移,X、Y轴位移)
旋转:RotateAnimation(旋转,包括缩放中心pivotX、pivotY)

启动activity的代码:
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        iv = (ImageView) findViewById(R.id.iv);
    }

位移代码:
    public void translate(View v){
        //定义位移补间动画
        private TranslateAnimation ta;
        //-100表示从图片的左边100个像素开始,到右边100个像素
        //上面60个像素开始,到下面60个像素结束
        //TranslateAnimation ta = new TranslateAnimation(-100, 100, -60, 60);

        //Animation.RELATIVE_TO_SELF 相对于自己左边1.5倍的距离
        ta = new TranslateAnimation(Animation.RELATIVE_TO_SELF, -1.5f, Animation.RELATIVE_TO_SELF, 1.5f, 
                Animation.RELATIVE_TO_SELF, -2, Animation.RELATIVE_TO_SELF, 2);

        ta.setDuration(3000);//定义动画持续时间
        ta.setRepeatCount(2);//设置重复次数
        ta.setRepeatMode(Animation.REVERSE);//设置重复模式
        ta.setFillAfter(true);//在结束位置上填充动画,就是动画完成了之后不会回复位,一般我们也不想复位
        iv.startAnimation(ta);//在iv这个控件上播放动画
    }

缩放代码:
    public void scale(View v){
        private ScaleAnimation sa;
        //三种不同的构造函数
        //ScaleAnimation sa = new ScaleAnimation(0.2f, 2, 0.2f, 2);//从x轴0.2倍开始到2倍,y轴从0.2倍开始到2倍
        //ScaleAnimation sa = new ScaleAnimation(0.2f, 2, 0.2f, 2, iv.getWidth()/2, iv.getHeight()/2);//缩放的中心点在图片中间
        sa = new ScaleAnimation(0.3f, 2, 0.2f, 1, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);//相对于自身的倍数大小

        sa.setDuration(2000);//定义动画持续时间
        sa.setRepeatCount(1);//设置重复次数
        sa.setRepeatMode(Animation.REVERSE);//设置重复模式
        sa.setFillAfter(true);//在结束位置上填充动画
        iv.startAnimation(sa);//播放动画
    }

透明代码:比较简单
    public void alpha(View v){
        private AlphaAnimation aa;
        aa = new AlphaAnimation(1, 0.2f);//从不透明,变为0.2的透明度
        aa.setDuration(2000);
        aa.setRepeatCount(1);
        aa.setRepeatMode(Animation.REVERSE);
        aa.setFillAfter(true);
        iv.startAnimation(aa);
    }

旋转代码:
    public void rotate(View v){
        private RotateAnimation ra;
        ra = new RotateAnimation(0,360);//顺时针从0到360度旋转,中心点在左上角
        //RotateAnimation ra = new RotateAnimation(0, 720, iv.getWidth()/2, iv.getHeight()/2);
        //ra = new RotateAnimation(0, -720, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);

        ra.setDuration(2000);
        ra.setRepeatCount(1);
        ra.setRepeatMode(Animation.REVERSE);
        ra.setFillAfter(true);
        iv.startAnimation(ra);
    }

播放一个动画集合,所有的动画一起播放
    注意,添加动画的时候,动画都还没有new,需要先每个动画做一次就行
    public void fly(View v){
        AnimationSet set = new AnimationSet(false);//创建动画集合,设置为false使用各自的校对器
        //把动画添加至集合
        set.addAnimation(ta);
        set.addAnimation(sa);
        set.addAnimation(aa);
        set.addAnimation(ra);
        iv.startAnimation(set);//开始播放集合
    }

这样补间动画就完成了

5、属性动画

3.0的新特性
补间动画就只是个虚的动画,图片的位置其实根本就没有变,只是个动画效果,而属性动画就是图片真的在动

代码演示:
public class MainActivity extends Activity {
    private ImageView iv;
    private ObjectAnimator oa1;
    private ObjectAnimator oa2;
    private ObjectAnimator oa3;
    private ObjectAnimator oa4;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        iv = (ImageView) findViewById(R.id.iv);
        iv.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                Toast.makeText(this, "clicked", 0).show();
            }
        });
    }

    public void translate(View v){
        //创建属性动画师
        //arg0:要操作的对象
        //arg1:要修改的属性的名字
        oa1 = ObjectAnimator.ofFloat(iv, "translationX", 0, 70, 30, 100);//注意,只能设置一个,不能x和y同时设置
        oa1.setDuration(2000);
        oa1.setRepeatCount(1);
        oa1.setRepeatMode(ValueAnimator.REVERSE);
        oa1.start();
    }

    public void scale(View v){
        oa2 = ObjectAnimator.ofFloat(iv, "scaleX", 0.2f, 2, 1, 2.5f);
        oa2.setDuration(2000);
        oa2.setRepeatCount(1);
        oa2.setRepeatMode(ValueAnimator.REVERSE);
        oa2.start();
    }

    public void alpha(View v){
        oa3 = ObjectAnimator.ofFloat(iv, "alpha", 0.2f, 1);
        oa3.setDuration(2000);
        oa3.setRepeatCount(1);
        oa3.setRepeatMode(ValueAnimator.REVERSE);
        oa3.start();
    }

    public void rotate(View v){
        oa4 = ObjectAnimator.ofFloat(iv, "rotation", 0, 360, 180, 720);
        oa4.setDuration(2000);
        oa4.setRepeatCount(1);
        oa4.setRepeatMode(ValueAnimator.REVERSE);
        oa4.start();
    }

    public void fly(View v){
        AnimatorSet set = new AnimatorSet();//创建动画师集合

        //set.playSequentially(oa1, oa2, oa3, oa4);//按顺序播放
        set.playTogether(oa1, oa2, oa3, oa4);//一起播放
        set.setTarget(iv);//设置属性动画师操作的对象
        set.start();
    }



}

6、XML资源文件定义属性动画

属性动画因为是真的在动,所以用的会比较多    
属性动画可以用代码创建也可以使用资源文件定义

我们创建一个propertyAnimation的xml文件,继承objectAnimation,会在res文件夹中自动创建一个animator的文件夹
布局文件的内容:(在animator文件夹下)

propertyAnimation.xml
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android" 
    android:propertyName="translationY"
    android:duration="2000"
    android:repeatCount="1"
    android:repeatMode="reverse"
    android:valueFrom="0"
    android:valueTo="100"
    >
</objectAnimator>

在代码里面把xml用填充器填充一个animator对象,再关联下需要设置动画的目标就OK
    public void xml(View v){
        //使用动画师填充器把xml资源文件填充成属性动画对象
        Animator animator = AnimatorInflater.loadAnimator(this, R.animator.property_animation);
        animator.setTarget(iv);
        animator.start();
    }
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值