table滑塊

咱們作table時,經常想作一個滑塊的移動效果,來讓app顯得更加生動,原理很簡單,廢話不說,直接上codeandroid

public class AnimationActivity extends AppCompatActivity {
    private Button bt01, bt02, bt03, bt04;
    private ImageView view;
    int screenWidth;//屏幕寬度
    int screenHeight;//屏幕高度
    int positionView = 0;//記錄滑塊的位置

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

        bt01 = (Button) findViewById(R.id.bt01);
        bt02 = (Button) findViewById(R.id.bt02);
        bt03 = (Button) findViewById(R.id.bt03);
        bt04 = (Button) findViewById(R.id.bt04);
        view = (ImageView) findViewById(R.id.view);

        //獲取屏幕寬高度
        DisplayMetrics dm = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(dm);
        screenWidth = dm.widthPixels / 4;//屏幕寬度的1/4,用來設置滑塊的寬度
        screenHeight = dm.heightPixels;//屏幕高度,用來設置滑塊的寬度

        //設置滑塊的寬高
        ViewGroup.LayoutParams params = view.getLayoutParams();
        params.height = screenHeight / 100;
        params.width = screenWidth;
        view.setLayoutParams(params);

        bt01.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //參數 1.動畫目標view 2.動畫移動方式 3.view出發的位置 4.view的目標位置
                ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationX", positionView, 0);
                animator.setDuration(300);
                animator.start();
                //移動後這裏要把位置設置爲當前的位置
                positionView = 0;
            }
        });
        bt02.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //參數 1.動畫目標view 2.動畫移動方式 3.view出發的位置 4.view的目標位置
                ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationX", positionView, screenWidth);
                animator.setDuration(300);
                animator.start();
                //移動後這裏要把位置設置爲當前的位置
                positionView = screenWidth;
            }
        });
        bt03.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //參數 1.動畫目標view 2.動畫移動方式 3.view出發的位置 4.view的目標位置
                ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationX", positionView, screenWidth * 2);
                animator.setDuration(300);
                animator.start();
                //移動後這裏要把位置設置爲當前的位置
                positionView = screenWidth * 2;
            }
        });
        bt04.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //參數 1.動畫目標view 2.動畫移動方式 3.view出發的位置 4.view的目標位置
                ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationX", positionView, screenWidth * 3);
                animator.setDuration(300);
                animator.start();
                //移動後這裏要把位置設置爲當前的位置
                positionView = screenWidth * 3;
            }
        });
    }
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.laoyimou.teststudio.AnimationActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <Button
            android:id="@+id/bt01"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="bt" />

        <Button
            android:id="@+id/bt02"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="bt" />

        <Button
            android:id="@+id/bt03"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="bt" />

        <Button
            android:id="@+id/bt04"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="bt" />
    </LinearLayout>

    <ImageView
        android:id="@+id/view"
        android:layout_width="50dp"
        android:layout_height="5dp"
        android:background="#563265" />
</LinearLayout>
相關文章
相關標籤/搜索