• Android中的动画,选择器,样式和主题的使用


    一、动画:

    1、动画的分类:

    1)、Tween动画:这种实现方式可以使视图组件移动、放大、缩小以及产生透明度的变化;

    2)、Frame动画:传统的动画方法,通过顺序的播放排列好的图片来实现,类似电影。

    1)Frame 帧动画 AnimationDrawable

    【参考api文档实现示例:/sdk/docs/guide/topics/resources/animation-resource.html#Frame】

    1、使用AnimationDrawable来操作:

    在res目录下,新建drawable与anim目录:

    drawable放入帧动画图片

    anim目录下新建帧动画xml文件来表示帧动画;

    布局文件:

         <ImageView       

            android:id="@+id/iv"

            android:onClick="start"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content" />

    帧动画文件rocket.xml

          <?xml version="1.0" encoding="utf-8"?>

           <!-- oneshot 是否只播放一次 -->

           <animation-list xmlns:android="http://schemas.android.com/apk/res/android"

                  android:oneshot="false" >

          <item  android:drawable="@drawable/girl_1" android:duration="200"/>

          <item  android:drawable="@drawable/girl_2" android:duration="200"/>

          <item  android:drawable="@drawable/girl_3" android:duration="200"/>

          <item  android:drawable="@drawable/girl_4" android:duration="200"/>

          <item  android:drawable="@drawable/girl_5" android:duration="200"/>

         <item  android:drawable="@drawable/girl_6" android:duration="200"/>

         <item  android:drawable="@drawable/girl_7" android:duration="200"/>

          <item  android:drawable="@drawable/girl_8" android:duration="200"/>

          <item  android:drawable="@drawable/girl_9" android:duration="200"/>

          <item  android:drawable="@drawable/girl_10" android:duration="200"/>

          <item  android:drawable="@drawable/girl_11" android:duration="200"/>

           </animation-list>

    代码:

     public class MainActivity extends Activity {

           private ImageView iv;

           private AnimationDrawable anim;       

           @Override

           protected void onCreate(Bundle savedInstanceState) {

                  super.onCreate(savedInstanceState);

                  setContentView(R.layout.activity_main);

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

                  iv.setBackgroundResource(R.anim.rocket);                 // 把动画设置为背景

                  anim = (AnimationDrawable) iv.getBackground();      // 获取背景

           }

           public void start(View v) {

                  if(anim.isRunning()) {

                         anim.stop();

                  }

                  anim.start();

           }

    }

    2)Tween动画:

    ①、有点类似以前弄的图片,处理,如旋转,缩放等,但Tween动画,注重的是动画过程,而不是结果;

    ②、创建方法:

    使用xml文件来定义动画,然后通过AnimationUtils来加载,获取动画对象

    使用代码方法,如:

           // 旋转动画(这里设置:围绕自己的中心点旋转)

           RotateAnimation ra = new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);

           ra.setDuration(1500);                                        // 旋转一次时间

           ra.setRepeatCount(Animation.INFINITE);          // 重复次数无限

           iv_scan.startAnimation(ra);                               // 开启动画

    分类:

    1、透明动画(alpha.xml)

    <set xmlns:android="http://schemas.android.com/apk/res/android"

        android:shareInterpolator="false" >

        <!-- 透明动画 -->

        <alpha

            android:repeatMode="reverse"             // 反转,播放动画

              android:repeatCount="infinite"              // 重复播放

            android:duration="1000"

            android:fromAlpha="1"

            android:toAlpha="0.2" />

    </set>

    2、缩放动画(scale.xml)

        <!-- 缩放动画 -->

     <set>  

          <scale

            android:duration="1000"

            android:fromXScale="1.0"                  // 起始x缩放级别,

            android:fromYScale="1.0"                  // 起始y缩放级别

              android:toXScale="2"                           // 目标x缩放级别, 这里设置为放大一倍

            android:toYScale="2"

            android:pivotX="0"                                   // 动画中心点设置;0 基于左上角;50%基于自身中央,50%p基于父容器中央, 大于0基于此像素

            android:pivotY="0"

            android:repeatCount="infinite"

            android:repeatMode="reverse"/>

    </set>

    3、位移动画(translate.xml)

        <!-- 位移动画 -->

        <translate

            android:duration="1000"

            android:fromXDelta="0"                            // 起始位移位置

            android:fromYDelta="0"

            android:repeatCount="infinite"

            android:repeatMode="reverse"

            android:toXDelta="100%"               // 移动到哪里,这里设置为,移动自身的右下角位置 100%

            android:toYDelta="100%" />

    4、旋转动画(rotate.xml)

         <!-- 旋转动画 -->

        <rotate

            android:duration="1000"

            android:fromDegrees="0"            // 旋转角度范围设置

              android:toDegrees="360"

            android:pivotX="50%"                // 动画中心点设置

            android:pivotY="50%"

            android:repeatCount="infinite"

            android:repeatMode="restart"

           />

    5、组合动画(all.xml)

          <!-- 组合动画:旋转 + 缩放 + 透明 -->

        <rotate

            android:duration="1000"

            android:fromDegrees="0"

            android:interpolator="@android:anim/linear_interpolator"         // 动画篡改器,设置匀速转动,不出现完成后,停顿

            android:pivotX="50%"

            android:pivotY="50%"

            android:repeatCount="infinite"

            android:repeatMode="restart"

            android:toDegrees="360" />

        <scale

            android:duration="1000"

            android:fromXScale="1.0"

            android:fromYScale="1.0"

            android:pivotX="50%"

            android:pivotY="50%"

            android:repeatCount="infinite"

            android:repeatMode="reverse"

            android:toXScale="2"

            android:toYScale="2" />

        <alpha

            android:duration="1000"

            android:fromAlpha="1"

            android:repeatCount="infinite"

            android:repeatMode="reverse"

            android:toAlpha="0.2" />

    代码:

     public class MainActivity extends Activity {            

           private ImageView imageView;

           @Override

           protected void onCreate(Bundle savedInstanceState) {

                  super.onCreate(savedInstanceState);

                  setContentView(R.layout.activity_main);

                  imageView = (ImageView) findViewById(R.id.imageView);

           }

           public void onClick(View v) {

                  Animation anim = null;         // 动画对象

                  switch (v.getId()) {

                         case R.id.alphaBT:                              // 透明动画

                                anim = AnimationUtils.loadAnimation(this, R.anim.alpha);       // 根据xml获取动画对象

                                break;

                         case R.id.rorateBT:                             // 旋转动画

                                anim = AnimationUtils.loadAnimation(this, R.anim.rotate);

                                break;

                         case R.id.scaleBT:                               // 缩放动画

                                anim = AnimationUtils.loadAnimation(this, R.anim.scale);

                                break;

                         case R.id.transalteBT:                          // 位移动画

                                anim = AnimationUtils.loadAnimation(this, R.anim.translate);

                                break;

                         case R.id.all:

                                anim = AnimationUtils.loadAnimation(this, R.anim.all);

                                break;

                  }

                  if (anim != null) {

                         imageView.startAnimation(anim);        // 启动动画

                  }

           }

    }

    动画篡改器interpolator

           Interpolator 定义了动画的变化速度,可以实现匀速、正加速、负加速、无规则变加速等;有以下几类(更多参考API):

    AccelerateDecelerateInterpolator,延迟减速,在动作执行到中间的时候才执行该特效。

    AccelerateInterpolator, 会使慢慢以(float)的参数降低速度。

    LinearInterpolator,平稳不变的,上面旋转动画中使用到了;

    DecelerateInterpolator,在中间加速,两头慢

    CycleInterpolator,曲线运动特效,要传递float型的参数。

    API Demo View 中有对应的动画插入器示例,可供参考;

    xml实现动画插入器:

    1、动画定义文件 /res/anim/目录下shake.xml :

           <translate xmlns:android="http://schemas.android.com/apk/res/android"

                      android:duration="500"

                      android:fromXDelta="0"

                      android:interpolator="@anim/cycle_3"

                      android:toXDelta="10" />

    2、interpolator 指定动画按照哪一种方式进行变化, cycle_3文件如下:

           <cycleInterpolator xmlns:android="http://schemas.android.com/apk/res/android" android:cycles="3" />

           表示循环播放动画3次;

    3、使用动画的,程序代码:

          Animation shake = AnimationUtils.loadAnimation(this, R.anim.shake);

           et_phone.startAnimation(shake);

    二、样式与主题

    1、样式

    1)、定义样式

    设置样式,在values文件夹下的任意文件中的<resources>中配置<style>标签

    <style name="itheima1">

        <item name="android:layout_width">match_parent</item>

        <item name="android:layout_height">wrap_content</item>

        <item name="android:textColor">#ff0000</item>

        <item name="android:textSize">30sp</item>

    </style>

    2)、继承样式,在<style>标签中配置属性parent

    <style name="itheima2" parent="itheima1">

        <item name="android:gravity">center</item>

        <item name="android:textColor">#00ff00</item>

    </style>

    <style name="itheima3" parent="itheima2">

        <item name="android:gravity">right</item>

        <item name="android:textColor">#0000ff</item>

    </style>

    3)、使用样式

    在layout文件的标签中配置style属性

    <TextView

        style="@style/itheima1"

        android:text="一段文本" />

    2、主题

    styles.xml中也可以为Activity定义属性

    <style name="AppTheme" parent="AppBaseTheme">

        <item name="android:windowNoTitle">true</item>

        <item name="android:windowFullscreen">true</item>

    </style>

    在AndroidManifest.xml文件中<activity>或者<application>节点上可以使用theme属性引用

    <activity

        android:name="com.itheima.style.MainActivity"

        android:theme="@style/AppTheme" />

    三、选择器:

    一)、创建xml文件:

    在drawable/xxx.xml下常见xml文件,在同目录下记得要放相关图片

    <?xml version="1.0" encoding="utf-8" ?>   

    <selector xmlns:android="http://schemas.android.com/apk/res/android"> 

    <!-- 默认时的背景图片-->  

      <item android:drawable="@drawable/pic1" />    

    <!-- 没有焦点时的背景图片 -->  

      <item android:state_window_focused="false"   

            android:drawable="@drawable/pic1" />   

    <!-- 非触摸模式下获得焦点并单击时的背景图片 -->  

      <item android:state_focused="true" android:state_pressed="true"   android:drawable= "@drawable/pic2" /> 

    <!-- 触摸模式下单击时的背景图片-->  

    <item android:state_focused="false" android:state_pressed="true"   android:drawable="@drawable/pic3" />  

    <!--选中时的图片背景-->  

      <item android:state_selected="true"   android:drawable="@drawable/pic4" />   

    <!--获得焦点时的图片背景-->  

      <item android:state_focused="true"   android:drawable="@drawable/pic5" />   

    </selector>

    二)使用xml文件:

    1、使用方法:

    1)、方法一:

    (1)在listview中配置android:listSelector="@drawable/xxx

    (2)在listview的item中添加属性android:background="@drawable/xxx"

    2)、方法二:

    Drawable drawable = getResources().getDrawable(R.drawable.xxx);  

           ListView.setSelector(drawable);

    但是这样会出现列表有时候为黑的情况,需要加上:

    android:cacheColorHint="@android:color/transparent"使其透明。

    2、相关属性:

    android:state_selected :是选中

    android:state_focused :是获得焦点

    android:state_pressed :是点击

    android:state_enabled :是设置是否响应事件,指所有事件

    根据这些状态同样可以设置button的selector效果。也可以设置selector改变button中的文字状态。

    3、Button文字效果

    1)以下是配置button中的文字效果:

    drawable/button_font.xml

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:state_selected="true" android:color="#FFF" />

        <item android:state_focused="true" android:color="#FFF" />

        <item android:state_pressed="true" android:color="#FFF" />

        <item android:color="#000" />

    </selector>

    2)Button还可以实现更复杂的效果,例如渐变

    drawable/button_color.xml

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">        / 

    <item android:state_pressed="true">//定义当button 处于pressed 状态时的形态。 

    <shape>

    <gradient  android:startColor="#8600ff" /> 

    <stroke   android:width="2dp" android:color="#000000" /> 

    <corners android:radius="5dp" />  

    <padding android:left="10dp" android:top="10dp" 

    android:bottom="10dp" android:right="10dp"/>  

    </shape> 

    </item> 

    <item android:state_focused="true">//定义当button获得 focus时的形态 

    <shape> 

    <gradient android:startColor="#eac100"/> 

    <stroke android:width="2dp" android:color="#333333"  color="#ffffff"/> 

    <corners android:radius="8dp" />   

    <padding android:left="10dp" android:top="10dp" 

    android:bottom="10dp" android:right="10dp"/>

    </shape> 

    </item>

    </selector> 

    3)最后,需要在包含 button的xml文件里添加两项。

    例如main.xml 文件,需要在<Button />里加两项

    android:focusable="true"

    android:background="@drawable/button_color"

    三)语法示例:

    1、文件位置:

    res/color/filename.xml,文件名被做资源的ID

    2、语法示例

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:state_selected="true" android:color="@color/white" />

        <item android:state_focused="true" android:color="@color/white" />

        <item android:state_pressed="true" android:color="@color/white" />

        <item android:state_enabled="true" android:color="@color/black"/>

        <item android:state_enabled="false" android:color="@color/white"/>

        <item android:state_window_focused="false" android:color="@color/black"/>

        <item android:color="@color/black" />

    </selector>

    3、属性

    android:color十六进制颜色,必须的。颜色是用RGB值来指定的,并且可选择alpha通道。

        这个值始终是用#字符开头,后面跟的是Appha-Red-Green-Blue信息,格式如下:

            #RGB

            #ARGB

            #RRGGBB

            #AARRGGBB

    android:state_pressed一个布尔值

    如果这个项目是在对象被按下时使用,那么就要设置为true。(如,按钮被触摸或点击时。)false应该用于默认的非按下状态。

    android:state_focused一个布尔值

    如果这个项目是在对象获取焦点时使用,那么就要设置为true。如,一个选项标签被打开时。

    如果这个项目要用于对象没有被被选择的时候,那么就要设置为false。

    android:state_checkable一个布尔值

    如果这个项目要用于对象的可选择状态,那么就要设置为true。

    如果这个项目要用于不可选状态,那么就要设置为false。(它只用于一个对象在可选和不可选之间的转换)。

    android:state_checked一个布尔值

    如果这个项目要用于对象被勾选的时候,那么就要设置为true。否者设为false。

    android:state_enabled一个布尔值

    如果这个项目要用于对象可用状态(接受触摸或点击事件的能力),那么就要设置为true,否者设置为false。

    android:state_window_focused一个布尔值

    如果这个项目要用于应用程序窗口的有焦点状态(应用程序是在前台),那么就要设置为true,否者设置false。

    4、注意

    A:要记住,状态列表中一个与对象当前状态匹配的项目会被使用。因此,如果列表中的第一项没有包含以上任何一种状态属性,那么每次都会使用这个项目,因此默认设置应该始终被放到最后。

    B:如果出现失去焦点,背景色延迟的情况,不要使用magin。

    C:drawable下的selector可是设置状态背景列表(可以让view的背景在不同状态时变化)说明:也可以定义状态背景列表,但是是定义在drawable文件夹下,用的不是color属性,而是drawable属性。

    四)

    、自定义选择器

    (shape和选择器如何同时使用。例如:如何让一个按钮即是圆角的,又能在点击的时候出现颜色变化。)

    1、定义xml文件,Root Element选择shape

    ①创建view被按下的布局文件:

    进行相应的属性配置,如:

    <?xml version="1.0" encoding="utf-8"?>

    <shape xmlns:android="http://schemas.android.com/apk/res/android"

        android:shape="rectangle" >

     <!-- 此处表示是一个矩形 -->

        <corners android:radius="3dp" />

     <!-- 此处表示是一个圆角 -->

        <solid android:color="#33000000" />

    </shape>

    ②创建view正常显示的布局(新建一个xml同),配置如下:

    <?xml version="1.0" encoding="utf-8"?>

    <shape xmlns:android="http://schemas.android.com/apk/res/android"

        android:shape="rectangle" >

     <!-- 此处表示是一个矩形 -->

        <corners android:radius="3dp" />

     <!-- 此处表示是一个圆角 -->

        <solid android:color="#00000000" />

    </shape>

    2、创建背景选择器:(Root Element为selector)

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:drawable="@drawable/bg_pressed" android:state_pressed="true"/>

        <!-- pressed -->

        <item android:drawable="@drawable/bg_pressed" android:state_focused="true"/>

        <!-- focused -->

        <item android:drawable="@drawable/bg_normal"/>

        <!-- 默认 -->

    </selector>

          

    3、将上面定义好的布局文件设定到选择器中(红字)

    在需要使用背景资源的布局文件中选择上面创建的背景选择器(selector)

    设置布局的clickable为true,并设置点击事件

  • 相关阅读:
    Kotlin 实现类似 C# 的 Event 事件代码
    nim 语言实现迭代器
    nim 语言使用 concept 实现 c# 的interface
    如何在 asp.net core mvc 项目中管理前端插件的引用
    遇到一个在 WPF 中使用 MessageBox 弹出但在打开后却立即自动关闭的问题
    如何在项目生成成功后,自动构建 nuget 包并复制或发布到指定位置
    在类库开发中,如何设定多个 .net 框架目标
    如何在 IIS 中重定向 http 请求至 https
    在 docker 中部署 phpmyadmin 使用 nginx 代理 https 时出现错误无法登录
    禅道中配置电子邮件发信遇到 SMTP 错误:无法连接到 SMTP 主机,点击重试可以成功
  • 原文地址:https://www.cnblogs.com/dubo-/p/6676227.html
Copyright © 2020-2023  润新知