動畫 (Animation) 資源型別詳述 (1)
詳細介紹程式資源的使用,格式和語法,包括
①Animation Resources
動畫資源,Tween動畫(Tween動畫是操作某個控制元件讓其展現出旋轉、漸變、移動、縮放的過程)儲存在res/anim資原始檔中,Frame動畫儲存在res/drawable資原始檔中。
②顏色狀態資源
定義在res/color/資料夾中。
③Drawable資源
定義在res/drawable/資料夾中。
④佈局資源
定義在res/layout/資料夾中。
⑤選單資源
定義在res/menu/資料夾中。
⑥字串資源
可以定義字串,字串陣列,和plurals (一種可以像printf函式那樣進行格式化輸出的字串),儲存在res/values/資料夾中,分別通過R.string, R.array, R.plurals進行訪問。
⑦樣式資源
定義介面的外觀和格式,儲存在res/values/資料夾中,使用R.style進行訪問。
⑧字型資源
儲存在res/font/資料夾中,使用R.font進行訪問。
⑨其它資源
Bool, Color, Dimension, ID, Integer, Integer Array, Typed Array.
1.Animation
Animation有兩種:Property Animation通過Animator類在一段時間內修改物件的屬性來建立動畫。
View Animation分為兩種,Tween animation 通過Animation函式在一個影象上進行變換 (平移、縮放)操作來建立動畫,Frame animation 通過AnimationDrawable類有序地顯示一系列的圖片來建立動畫。
Property animation儲存在res/animator資料夾中,
語法規則:
<set android:ordering=["together" | "sequentially"]> <objectAnimator android:propertyName="string" android:duration="int" android:valueFrom="float | int | color" android:valueTo="float | int | color" android:startOffset="int" android:repeatCount="int" android:repeatMode=["repeat" | "reverse"] android:valueType=["intType" | "floatType"]/> <animator android:duration="int" android:valueFrom="float | int | color" android:valueTo="float | int | color" android:startOffset="int" android:repeatCount="int" android:repeatMode=["repeat" | "reverse"] android:valueType=["intType" | "floatType"]/> <set> ... </set> </set>
<set>表示集合,集合可以包括代表物件的<objectAnimator>和包括數值的<valueAnimator>,也可以包括集合自己,可以對相關的屬性進行設定。比如set有個屬性ordering有可以填寫兩個數值,together表示所有的animator同時執行,sequentially表示按照佈局檔案先後執行。
可以寫個xml檔案實際感受到這些屬性的作
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="together">
<objectAnimator
android:propertyName="y"
android:duration="750"
android:valueFrom="200"
android:valueTo="700"
android:repeatCount="1"
android:repeatMode="reverse"
/>
<objectAnimator
android:propertyName="alpha"
android:duration="750"
android:valueFrom="1.0"
android:valueTo="0"
android:repeatCount="1"
android:repeatMode="reverse"
/>
</set>
先建立一個物件,這個物件包括很多屬性,比如alpha,位置座標,顏色,形狀等。
通過Animator就可以動態地改變這些屬性值顯示不同的效果。
點選按鈕,四個球開始運動,第一個球按照模擬物體落地,使用BoundInterpolator,官方定義大概十個插補器,需要具體的操作才能知道效果。
/**
* pvhY = PropertyValuesHolder.ofFloat("y", ball.getY(),
* getHeight() - BALL_SIZE);
* PropertyValuesHolder pvhAlpha = PropertyValuesHolder.ofFloat("alpha", 1.0f, 0f);
* ObjectAnimator yAlphaBouncer = ObjectAnimator.ofPropertyValuesHolder(ball,
* pvhY, pvhAlpha).setDuration(DURATION/2);
* yAlphaBouncer.setInterpolator(new AccelerateInterpolator());
* yAlphaBouncer.setRepeatCount(1);
* yAlphaBouncer.setRepeatMode(ValueAnimator.REVERSE);
*
*/
set = (AnimatorSet) AnimatorInflater.loadAnimator(
PropertyAnimation.this, R.animator.ball_y_alpha);
set.setTarget(ball);
ball = balls.get(2);
PropertyValuesHolder pvhW = PropertyValuesHolder.ofFloat("width", ball.getWidth(),
ball.getWidth() * 2);
PropertyValuesHolder pvhH = PropertyValuesHolder.ofFloat("height", ball.getHeight(),
ball.getHeight() * 2);
PropertyValuesHolder pvTX = PropertyValuesHolder.ofFloat("x", ball.getX(),
ball.getX() - BALL_SIZE / 2f);
PropertyValuesHolder pvTY = PropertyValuesHolder.ofFloat("y", ball.getY(),
ball.getY() - BALL_SIZE / 2f);
ObjectAnimator whxyBouncer = ObjectAnimator.ofPropertyValuesHolder(ball, pvhW, pvhH,
pvTX, pvTY).setDuration(DURATION / 2);
whxyBouncer.setRepeatCount(1);
whxyBouncer.setRepeatMode(ValueAnimator.REVERSE);
用程式碼寫這些動態的效果很麻煩,所以推薦使用xml檔案定義,簡單直觀。
Frame animation是預製一組連貫的圖片,本例中使用的是桃心,連續載入不同刻度的桃心顯示動態的效果。
public class FrameAnimation extends Activity {
ConstraintLayout layout;
ImageView heartImage;
AnimationDrawable heartAnimation;
// 控制動畫的執行和停止。
boolean toggle;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.button);
layout = findViewById(R.id.container);
layout.setBackgroundColor(getColor(R.color.cyan));
heartImage = new ImageView(this);
heartImage.setBackground(getDrawable(R.drawable.ic_heart));
heartAnimation = (AnimationDrawable) heartImage.getBackground();
toggle = true;
layout.addView(heartImage);
}
public void sendMessage(View view) {
toggle ^= true;
heartAnimation.start();
if (heartAnimation.isRunning() && toggle) {
heartAnimation.stop();
}
}
}
最後是Tween animation,通過旋轉,縮放,拉伸等形式改變圖片的顯示,參考原始碼可以看到指南針變形的動畫。
xml檔案存放在res/anim/資料夾下面。
<scale
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXScale="1.0"
android:toXScale="1.4"
android:fromYScale="1.0"
android:toYScale="0.6"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="false"
android:duration="700" />
<set
android:interpolator="@android:anim/accelerate_interpolator"
android:startOffset="700">
<scale
android:fromXScale="1.4"
android:toXScale="0.0"
android:fromYScale="0.6"
android:toYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="400" />
<rotate
android:fromDegrees="0"
android:toDegrees="-45"
android:toYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="400" />
</set>
2.Color state list
根據不同的狀態顯示不同的顏色值,定義個按鈕,讓它的文字根據不同的狀態顏色發生變化。
xml檔案存放在res/color/目錄下面。
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:color="#ffff0000" /> <!-- pressed -->
<item android:state_focused="true"
android:color="#ff0000ff" /> <!-- focused -->
<item android:color="#00ffff" /> <!-- default -->
</selector>
設定textColor屬性值,點選按鈕的時候按鈕的文字會變成紅色。