ElasticViews

 收藏    我在用   0 人在用
 -  null

This is ElasticViews by skydoves

 GitHub     下载     同步

12    265    27    over 1 year前

ElasticViews

Android views with touch Animation.

gif0
gif1

Including in your project

build.gradle

repositories {
  mavenCentral() // or jcenter() works as well
}

dependencies {
  compile 'com.github.skydoves:elasticviews:1.0.6'
  compile 'com.android.support:design:25.2.+' // maybe you need
}

or Maven

<dependency>
  <groupId>com.github.skydoves</groupId>
  <artifactId>elasticviews</artifactId>
  <version>1.0.6</version>
</dependency>

Usage

You can use like using normal views and you can give all of Views or GroupViews touch effect very simply.

Add XML Namespace

First add below XML Namespace inside your XML layout file.

xmlns:app="http://schemas.android.com/apk/res-auto"

OnClick Method

All of ElasticViews need setOnClickListener - OnClick Method. If not, no Animation.

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

or use 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

If button_backgroundColor attribute set as @android:color/transparent <br>
you can use ElasticButton looks like 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 don't animation for child views.<br>
If you want give ViewGroup animation, then use 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

you can give all of Views or GroupViews touch effect very simply.<br>

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

Example : Normal Button

you can give all of Views touch effect.

@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);
    }

Example : ListView Item

you can give all of ViewGroups touch effect.

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

gif2

License

Copyright 2017 skydoves

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

 
No Reply at the moment.
需要 Sign In 后方可回复, 如果你还没有账号请点击这里 Sign Up