APP启动页背景颜色变化

原创 2017年08月15日 15:49:07

在APP的启动页经常会有一些渐变效果。

如果是从半透明渐变为不透明,用View动画AlphaAnimation就能完成。

而View动画只有渐变,旋转,平移,和缩放四种动画效果,是完成不了颜色变化的任务的。所以需要用到属性动画。

demo下载:http://download.csdn.net/download/qq_25806863/9934747

下面是三种用属性动画让启动页背景颜色渐变的方法:

界面准备

几个启动页面都用同一套布局,很简单

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/launch"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">


    <ImageView
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center_horizontal|bottom"
        android:src="@mipmap/ic_launcher" />


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="20dp"
        android:gravity="center"
        android:text="V5.1" />

</LinearLayout>

这里写图片描述

1.ValueAnimator.ofArgb,由红变白

ValueAnimator动画改变的是数值,不会直接改变属性,所以需要在监听数值变化的时候自己去设置属性。

public class Launch1Activity extends AppCompatActivity {

    private LinearLayout launch;

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

        launch = (LinearLayout) findViewById(R.id.launch);

        startAnimate();
    }

    private void startAnimate() {
        ValueAnimator valueAnimator = ValueAnimator.ofArgb(Color.RED, Color.WHITE);
        valueAnimator.setDuration(3000);

        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator valueAnimator) {
              //这里设置背景颜色
                launch.setBackgroundColor((Integer) valueAnimator.getAnimatedValue());
            }
        });

        valueAnimator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
              //跳转到首页
                skip();
            }
        });
        valueAnimator.start();
    }

    private void skip() {
        startActivity(new Intent(this, MainActivity.class));
        finish();
    }
}

这里写图片描述

2.ObjectAnimator.ofObject由红变蓝

这里用到了ColorDrawable来作为背景。

通过改变ColorDrawable的颜色来达到效果。

public class Launch2Activity extends AppCompatActivity {

    private LinearLayout launch;

    private ColorDrawable background;

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

        launch = (LinearLayout) findViewById(R.id.launch);

        background = new ColorDrawable(Color.RED);

        launch.setBackground(background);

        startAnimate();
    }

    private void startAnimate() {

        ArgbEvaluator evaluator = new ArgbEvaluator();
        ObjectAnimator objectAnimator = ObjectAnimator.ofObject(this, property, evaluator, Color.BLUE);
        objectAnimator.setDuration(3000);
        objectAnimator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                skip();
            }
        });
        objectAnimator.start();

    }

    private void skip() {
        startActivity(new Intent(this, MainActivity.class));
        finish();
    }

    private  Property<Launch2Activity, Object> property = new Property<Launch2Activity, Object>(Object.class, "background") {
        @Override
        public void set(Launch2Activity object, Object value) {
            object.background.setColor((Integer) value);
        }

        @Override
        public Object get(Launch2Activity object) {
            return object.background.getColor();
        }
    };
}

这里写图片描述

3.ObjectAnimator.ofInt由红变黄

这个就是简单的属性动画了。

public class Launch3Activity extends AppCompatActivity {

    private LinearLayout launch;

    private ColorDrawable background;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_launch1);
        launch = (LinearLayout) findViewById(R.id.launch);
        startAnimate();
    }

    private void startAnimate() {

        ArgbEvaluator evaluator = new ArgbEvaluator();
        ObjectAnimator objectAnimator = ObjectAnimator.ofInt(launch, "backgroundColor", Color.RED, Color.YELLOW);
        objectAnimator.setEvaluator(new ArgbEvaluator());
        objectAnimator.setDuration(3000);
        objectAnimator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                skip();
            }
        });
        objectAnimator.start();

    }

    private void skip() {
        startActivity(new Intent(this, MainActivity.class));
        finish();
    }
}

。。。

。。。

获取APP的Launch Image,实现启动页面的过渡动画。

文章转自里脊串大神的博客http://adad184.com/2015/10/15/tips-access-current-launch-image/ 启动图(LaunchImage)的管理其实在i...
  • a416863220
  • a416863220
  • 2015年12月04日 11:11
  • 1279

App启动页--实现一

使用补间动画 xml布局:
  • forwordlove
  • forwordlove
  • 2016年09月26日 16:57
  • 230

带你实现开发者头条(一) 启动页实现

对于很多初学者或者刚工作的Android新手来说,我们的项目经验还停留在做demo的阶段,有没有一种很low的感觉,并且当你真正上手做大项目的时候又不知道把自己学到的东西用上去。。有一种自己家里有座金...
  • lowprofile_coding
  • lowprofile_coding
  • 2016年04月16日 21:21
  • 4850

教你搞定APP启动页四种设计方案【APP实战篇】

无论是公司的APP项目,还是自己接的项目,app启动页都是需要的。至于采用不采用,也要看具体app的产品体验和产品运营思路等。 第一种APP启动页设计方案: 扁平法 简单粗暴的手法。简单的纯色...
  • jiangmengmeng517
  • jiangmengmeng517
  • 2014年12月26日 11:39
  • 1815

app启动页java后台的设计

最近刚接触移动互联的后台开发,其中做了一个功能就是app启动加载的广告页由后台来传递图片以及超链接。详细描述需求:就是会给公司的运营开一个帐号来登录后台管理系统,之后由他来选择ui做的广告图片和超链接...
  • qq_33350186
  • qq_33350186
  • 2017年03月29日 20:54
  • 408

产品策划三:App启动页的策划方案

App启动页是指app在启东时需要加载必要的运行环境和配置,在这个过程中提示用户等待的一个过渡页面。 在产品经理眼里启动页是app给予用户重要的第一印象;也是App最重要的黄金页面之一,所有用户...
  • lm_soso
  • lm_soso
  • 2016年01月25日 15:55
  • 390

APP启动页的正确配置方式

在APP的启动页面(Splash Screen)好多都是等待3秒,好一点的还可以跳过,但是有的跳过也是假的按钮。当然像一些大厂的APP,像网易新闻等启动页面都是广告,人家要收广告费的。但是,对于一些普...
  • Wei_Smile
  • Wei_Smile
  • 2016年03月01日 16:54
  • 3737

使用H5做app启动页优化

随着移动设备性能不断增强,web 页面的性能体验逐渐变得可以接受,又因为 web 开发模式的诸多好处(跨平台,动态更新,减体积,无限扩展),APP 客户端里出现越来越多内嵌 web 页面(为了配上当前...
  • zhang522802884
  • zhang522802884
  • 2017年09月06日 15:18
  • 720

Android产品研发(二)-->启动页优化

上一篇文章中我们介绍加单说明了一下android的编码规范,这里我是强烈建议大家在团队合作中约定编码规范的,哪怕是一个并不是十分规范的规范总比没有规范好得多,尤其是团队产品的研发,对产品的持续迭代过程...
  • qq_23547831
  • qq_23547831
  • 2016年05月31日 16:31
  • 11129

android 通知栏背景颜色跟随app导航栏背景颜色变化而变化

通知栏(notification)背景颜色跟随app导航栏(top title)背景颜色变化而变化。 这也叫沉浸式状态栏,这是Google在android 4.4以上的系统提出的。 样式如图所示: ...
  • lwcumt
  • lwcumt
  • 2015年06月25日 10:21
  • 17776
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:APP启动页背景颜色变化
举报原因:
原因补充:

(最多只允许输入30个字)