ElasticViews

介绍:

带触摸响应动画的view

运行效果:

使用说明:

build.gradle

repositories {
  mavenCentral() // or jcenter() works as well
}
dependencies {
  compile 'com.github.skydoves:elasticviews:1.0.8'
  compile 'com.android.support:design:24.2.+' // may need
}

OnClick Method

所有的ElasticView都需要设置setOnClickListener-OnClick 方法。不然没有动画效果

ElasticButton elasticButton = (ElasticButton)findViewById(R.id.elasticbutton);
        elasticButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // do something
            }
        });

或者使用 butterknife

@OnClick(R.id.elasticbutton)
    public void onClick(View v){
        // do something
    }

ElasticButton

<com.github.skydoves.ElasticButton
        android:id="@+id/elasticbutton"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        app:button_backgroundColor="#30354b"
        app:button_round="20"
        app:button_scale="0.7"
        app:button_duration="400"
        app:button_labelText="Elastic Button"
        app:button_labelColor="#ffffff"
        app:button_labelSize="16"
        app:button_labelStyle="bold"/>

ElasticButton use like TextView

如果button_backgroundColor属性设置为@android:color/transparent 

你可以把ElasticButton当作TextView使用

app:button_backgroundColor="@android:color/transparent"

ElasticCheckButton

<com.github.skydoves.ElasticCheckButton
        android:id="@+id/elasticcheckbutton"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        app:checkbutton_backgroundColor="#30354b"
        app:checkbutton_round="30"
        app:checkbutton_scale="0.9"
        app:checkbutton_duration="400"
        app:checkbutton_labelText="Elastic CheckButton"
        app:checkbutton_labelColor="#ffffff"
        app:checkbutton_labelSize="16"
        app:checkbutton_labelStyle="bold"
        app:checkbutton_alpha="0.5"
        app:checkbutton_ischecked="false"/>

ElasticImageView

<com.github.skydoves.ElasticImageView
            android:id="@+id/elasticimageview"
            android:layout_width="64dp"
            android:layout_height="64dp"
            android:scaleType="fitXY"
            android:src="@drawable/ic_question"
            app:imageview_duration="500"
            app:imageview_scale="0.7"/>

ElasticFloatingButton

<com.github.skydoves.ElasticFloatingActionButton
            android:id="@+id/elasticfab"
            android:layout_width="64dp"
            android:layout_height="64dp"
            android:src="@drawable/ic_add"
            app:fabSize="normal"
            app:fabutton_duration="400"
            app:fabutton_scale="0.85"/>

ElasticLayout

ElasticLayout不会让子view具有动画效果。

如果你想让ViewGroup有动画,使用ElasticAction。

<com.github.skydoves.ElasticLayout
        android:id="@+id/elasticlayout"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        app:layout_backgroundColor="#30354b"
        app:layout_duration="500"
        app:layout_scale="0.85">
        <TextView
            android:id="@+id/textView0"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="This is"
            android:textColor="#ffffff"
            android:textSize="18sp" />
        <TextView
            android:layout_below="@+id/textView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:text="ElasticLayout"
            android:textColor="#ffffff"
            android:textSize="18sp"
            android:gravity="end" />
    </com.github.skydoves.ElasticLayout>

ElasticAction

你可以轻松让任何view或者viewgroup具有触摸效果。

// argument : View or ViewGroup, Animation duration, scaleX, scaleY
ElasticAction.doAction(anyViews, duration, 0.9f, 0.9f);

例子 : 普通 Button

@OnClick(R.id.button)
    public void addNewAlarm(View v){
        // ElasticAction : doAction
        ElasticAction.doAction(v, 400, 0.85f, 0.85f); // argument : View or ViewGroup, duration, scaleX, scaleY
        // PostDelayed : delay duration time
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                //Do something after duration time
            }
        }, 400);
    }

例子 : ListView Item

private class ListViewItemClickListener implements AdapterView.OnItemClickListener{
        @Override
        public void onItemClick(AdapterView<?> adapterView, View clickedView, final int pos, long id)
        {
            // set your duration time
            int duration = 400;
            // ElasticAction : doAction
            ElasticAction.doAction(clickedView, duration, 0.9f, 0.9f); // argument : View or ViewGroup, duration, scaleX, scaleY
            // PostDelayed : delay duration time
            new Handler().postDelayed(new Runnable() {
                @Override
                public void run() {
                    //Do something after duration time
                    Toast.makeText(getBaseContext(), "ListViewItem" + pos, Toast.LENGTH_SHORT).show();
                }
            }, duration);
        }
    };

ElasticAction Preview

14bc94aa-e15d-11e6-9078-2dfc9d97ef87.gif

已下载
0