Thursday, 18 February 2016

DialogBox Animation

Hello friends
Today we are studying how to set animation in dialog box in android.So lets start and enjoying.....

Create a anim directory(folder) in res folder and then create 4 file name of below given.


slide-up.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromYDelta="100%"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toXDelta="0" 
/>

</set>


slide_down.xml



<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromYDelta="0%p"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toYDelta="100%p"
/>

</set>

zoom_in.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/linear_interpolator"
        android:fromXScale="0.0"
        android:toXScale="1.0"
        android:fromYScale="0.0"
        android:toYScale="1.0"
        android:fillAfter="false"
        android:startOffset="200"
        android:duration="200"
        android:pivotX = "50%"
        android:pivotY = "-90%"
       
/>
    <translate
        android:fromYDelta="50%"
        android:toYDelta="0"
        android:startOffset="200"
        android:duration="200"
       
/>
</set>


zoom_out.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/linear_interpolator"
        android:fromXScale="1.0"
        android:toXScale="0.0"
        android:fromYScale="1.0"
        android:toYScale="0.0"
        android:fillAfter="false"
        android:duration="200"
        android:pivotX = "50%"
        android:pivotY = "-90%"
       
/>
    <translate
        android:fromYDelta="0"
        android:toYDelta="50%"
        android:duration="200"
       
/>
</set>


Now you entry this animation  in style resource file ..

style.xml


<resources>

    <!-- Base application theme. -->
   
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
       
<item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <style name="SamAnimation.Window" parent="@android:style/Animation.Activity">
        <item name="android:windowEnterAnimation">@anim/zoom_in</item>
        <item name="android:windowExitAnimation">@anim/zoom_out</item>
    </style>

    <style name="SetDialogAnimation">
        <item name="android:windowEnterAnimation">@anim/slide_up</item>
        <item name="android:windowExitAnimation">@anim/slide_down</item>
    </style>
</resources>

Now you create custom dialogbox view

dialog_viewss.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
>

    <TextView
        android:padding="10dp"
        android:gravity="center"
        android:textColor="#990000"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Testing"
/>

    <TextView
        android:padding="10dp"
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Testing"
/>

    <TextView
        android:padding="10dp"
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Testing"
/>
</LinearLayout>

main_activity.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#e5e5e5"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
>

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="26dp"
        android:paddingBottom="5dp"
        android:layout_weight="1"
        android:layout_gravity="center_vertical"
        android:text="Dialog-1"
/>

    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="26dp"
        android:paddingBottom="5dp"
        android:layout_weight="1"
        android:layout_gravity="center_vertical"
        android:text="Dialog-2"
/>

</LinearLayout>


Now you go MainActivity java class and paste below code carefully

MainActivity.java


package com.samset.dialoganimation;

import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
    Button button1,button2;
    AlertDialog alertDialog;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        button1= (Button) findViewById(R.id.btn1);
        button2= (Button) findViewById(R.id.btn2);


        button1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v)
            {
                Alert(0);

            }
        });

        button2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v)
            {
                Alert(1);

            }
        });
    }
    private void Alert(int i)
    {
        LayoutInflater layoutInflater = LayoutInflater.from(this);
        View view = layoutInflater.inflate(R.layout.dialog_viewss, null);
        getDialogBox(view,i);
    }
    private AlertDialog.Builder getDialogBox(View view,int i) {
        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setView(view);
        builder.setCancelable(true);
        alertDialog=builder.create();
        if (i==0)
        {
                alertDialog.getWindow().getAttributes().windowAnimations=R.style.SamAnimation_Window;
        }else
       
{
            alertDialog.getWindow().getAttributes().windowAnimations=R.style.SetDialogAnimation;
        }

        alertDialog.show();
        return builder;

    }
}


Thanks
I hope this blog helps you

See live sample








Download full source code

https://github.com/SamsetDev/DialogboxAnimation/tree/master




No comments:

Post a Comment