Android实现登陆界面动画

先上效果图


静态的效果图无法完全展示效果。
上个gif图吧：

实现原理是利用安卓的AnimationDrawable资源。
在一个帧布局里有两个图层，下面的图层绘制一个椭圆，然后用Animation控制旋转，上面是一个viewpager，有两个页面，这两个页面个用Adapter填充，Adapter的元素是两个Fragement。图层设置透明度0.5，以显示下面的椭圆背景。

上图是底部的涂层。
xml的animation属性代码：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/linear_interpolator" >    <!-- 透明度控制动画效果 alpha 浮点型值： fromAlpha 属性为动画起始时透明度 toAlpha 属性为动画结束时透明度 说明: 0.0表示完全透明 1.0表示完全不透明 以上值取0.0-1.0之间的float数据类型的数字 长整型值： duration 属性为动画持续时间 说明: 时间以毫秒为单位 -->    <rotate        android:duration="1000000"        android:fromDegrees="300"        android:pivotX="50%"        android:pivotY="50%"        android:toDegrees="-15000" /></set>

容器实现代码：

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <LinearLayout        android:id="@+id/loginbac"        android:layout_width="500dip"        android:layout_height="700dip"        android:background="@drawable/bg1"        android:gravity="center_horizontal"        android:orientation="vertical"        android:paddingBottom="@dimen/activity_vertical_margin"        android:paddingLeft="@dimen/activity_horizontal_margin"        android:paddingRight="@dimen/activity_horizontal_margin"        android:paddingTop="@dimen/activity_vertical_margin" >    </LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent" >        <android.support.v4.view.ViewPager            android:id="@+id/Viewpagerlogin"            android:layout_width="match_parent"            android:layout_height="match_parent" />    </LinearLayout></FrameLayout>

我们可以看到，这个布局使用了帧布局，其中logbac是一个椭圆背景，它的上方是一个Viewpager.
该布局绑定的Activity：

package com.example.weixin;import java.util.ArrayList;import java.util.List;import android.app.Activity;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.view.Window;import android.view.WindowManager;import android.view.animation.AlphaAnimation;import android.view.animation.Animation;import android.view.animation.AnimationUtils;import android.widget.LinearLayout;public class LogIn extends FragmentActivity {    private LinearLayout loginbac = null;    ViewPager viewPager = null;    private List<Fragment> loginList = new ArrayList<Fragment>();    private FragmentPagerAdapter loginAdapter = null;    @Override    protected void onCreate(Bundle savedInstanceState) {        // TODO Auto-generated method stub        super.onCreate(savedInstanceState);        requestWindowFeature(Window.FEATURE_NO_TITLE);        setContentView(R.layout.login_register);        getWindow()                .addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);        // 透明导航栏        getWindow().addFlags(                WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);        loginbac = (LinearLayout) findViewById(R.id.loginbac);        // Animation animation = new AlphaAnimation(0.1f,        // 1.0f);animation.setDuration(5000);        Animation animation = AnimationUtils.loadAnimation(this,                R.drawable.alpha);        loginbac.setAnimation(animation);        viewPager = (ViewPager) findViewById(R.id.Viewpagerlogin);        LoginFragement loginFragement = new LoginFragement();        registerFragement registerFragement=new registerFragement();        loginList.add(loginFragement);        loginList.add(registerFragement);        loginAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {            @Override            public int getCount() {                // TODO Auto-generated method stub                return loginList.size();            }            @Override            public Fragment getItem(int arg0) {                // TODO Auto-generated method stub                return loginList.get(arg0);            }        };        viewPager.setAdapter(loginAdapter);    }}

在java代码里我们使用animation控制背景椭圆的旋转。

上图是登陆的Fragement
对应的xml布局：

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:alpha="0.9"        android:background="@drawable/bg2bak"        android:gravity="center_horizontal"        android:orientation="vertical"        android:paddingBottom="@dimen/activity_vertical_margin"        android:paddingLeft="@dimen/activity_horizontal_margin"        android:paddingRight="@dimen/activity_horizontal_margin"        android:paddingTop="@dimen/activity_vertical_margin" >    </LinearLayout>    <!-- Login progress -->    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:focusable="true"        android:focusableInTouchMode="true"        android:gravity="center_horizontal"        android:orientation="vertical"        android:paddingBottom="@dimen/activity_vertical_margin"        android:paddingLeft="@dimen/activity_horizontal_margin"        android:paddingRight="@dimen/activity_horizontal_margin"        android:paddingTop="@dimen/activity_vertical_margin" >        <ImageView            android:id="@+id/img"            android:layout_width="140dip"            android:layout_height="55dip"            android:layout_marginTop="60dip"            android:background="@drawable/introshop" />        <TextView            android:layout_width="300dip"            android:layout_height="20dip"            android:layout_marginLeft="20dip"            android:layout_marginTop="5dip"            android:text="立即注册，开始享受高效率的购物生活。"            android:textColor="#FFFFFF"            android:textSize="15dip" />        <ProgressBar            android:id="@+id/login_progress"            style="?android:attr/progressBarStyleLarge"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginBottom="8dp"            android:visibility="gone" />        <ScrollView            android:id="@+id/login_form"            android:layout_width="match_parent"            android:layout_height="match_parent" >            <LinearLayout                android:id="@+id/email_login_form"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:layout_marginTop="10dip"                android:orientation="vertical" >                <EditText                    android:id="@+id/login_edittext"                    android:layout_width="300dip"                    android:layout_height="50dip"                    android:layout_marginLeft="10dip"                    android:hint="E-mile/手机号/用户名"                    android:textColor="#FFFFFF" />                <EditText                    android:id="@+id/logpassword_edittext"                    android:layout_width="300dip"                    android:layout_height="50dip"                    android:layout_marginLeft="10dip"                    android:hint="Password"                    android:password="true"                    android:textColor="#FFFFFF" />                <Button                    android:id="@+id/sign_in_button"                    android:layout_width="300dip"                    android:layout_height="wrap_content"                    android:layout_marginLeft="10dip"                    android:layout_marginTop="40dip"                    android:background="@drawable/shape1"                    android:text="@string/action_sign_in"                    android:textColor="#FFFFFF"                    android:textStyle="bold" />                <TextView                    android:layout_width="120dip"                    android:layout_height="40dip"                    android:layout_marginLeft="230dip"                    android:layout_marginTop="200dip"                    android:text="忘记密码？"                    android:textColor="#595959"                    android:textSize="17dip"                    android:textStyle="italic" />            </LinearLayout>        </ScrollView>    </LinearLayout></FrameLayout>

该布局绑定的Fragement：

package com.example.weixin;import java.io.IOException;import java.io.UnsupportedEncodingException;import java.security.MessageDigest;import java.security.NoSuchAlgorithmException;import java.util.ArrayList;import java.util.List;import org.apache.http.HttpResponse;import org.apache.http.NameValuePair;import org.apache.http.ParseException;import org.apache.http.client.ClientProtocolException;import org.apache.http.client.HttpClient;import org.apache.http.client.entity.UrlEncodedFormEntity;import org.apache.http.client.methods.HttpPost;import org.apache.http.impl.client.DefaultHttpClient;import org.apache.http.message.BasicNameValuePair;import org.apache.http.protocol.HTTP;import org.apache.http.util.EntityUtils;import org.json.JSONException;import org.json.JSONObject;import android.os.Bundle;import android.os.Handler;import android.os.Message;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.View.OnClickListener;import android.view.ViewGroup;import android.widget.Button;import android.widget.EditText;public class LoginFragement extends Fragment {    private EditText loginEditText = null;    private EditText logpasswordEditText = null;    private Button loginButton = null;    private HttpClient httpClient = null;    private String md5password = null;    private String jsonString = null;    private Handler handler = null;    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,            Bundle savedInstanceState) {        handler = new Handler() {            @Override            public void handleMessage(Message msg) {                // TODO Auto-generated method stub                loginButton.setText(jsonString);            }        };        View rootvView2 = inflater.inflate(R.layout.loginfragement, container,                false);        httpClient = new DefaultHttpClient();        loginEditText = (EditText) rootvView2.findViewById(R.id.login_edittext);        logpasswordEditText = (EditText) rootvView2                .findViewById(R.id.logpassword_edittext);        loginButton = (Button) rootvView2.findViewById(R.id.sign_in_button);        loginButton.setOnClickListener(new OnClickListener() {            @Override            public void onClick(View v) {                // TODO Auto-generated method stub                md5password = getMD5(logpasswordEditText.getText().toString());                new Thread() {                    @Override                    public void run() {                        // TODO Auto-generated method stub                        try {                            HttpPost post = new HttpPost(                                    "http://192.168.191.3:8080/DSDG/userLogin");                            List<NameValuePair> parmas = new ArrayList<NameValuePair>();                            parmas.add(new BasicNameValuePair("username",                                    loginEditText.getText().toString()));                            parmas.add(new BasicNameValuePair("password",                                    md5password));                            post.setEntity(new UrlEncodedFormEntity(parmas,                                    HTTP.UTF_8));                            HttpResponse response = httpClient.execute(post);                            JSONObject jsonObject = new JSONObject(EntityUtils                                    .toString(response.getEntity()));                            jsonString = jsonObject.getString("mesg");                            handler.sendEmptyMessage(0x123);                            // if (jsonObject.getString("status") == "200") {                            // loginButton.setText("success!");                            // }                        } catch (UnsupportedEncodingException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        } catch (ClientProtocolException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        } catch (IOException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        } catch (ParseException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        } catch (JSONException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        }                    }                }.start();            }        });        return rootvView2;    }    public String getMD5(String info) {        try {            MessageDigest md5 = MessageDigest.getInstance("MD5");            md5.update(info.getBytes("UTF-8"));            byte[] encryption = md5.digest();            StringBuffer strBuf = new StringBuffer();            for (int i = 0; i < encryption.length; i++) {                if (Integer.toHexString(0xff & encryption[i]).length() == 1) {                    strBuf.append("0").append(                            Integer.toHexString(0xff & encryption[i]));                } else {                    strBuf.append(Integer.toHexString(0xff & encryption[i]));                }            }            return strBuf.toString();        } catch (NoSuchAlgorithmException e) {            return "";        } catch (UnsupportedEncodingException e) {            return "";        }    }}

上图是注册的Fragement
对应的xml布局：

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:alpha="0.9"        android:background="@drawable/bg2"        android:gravity="center_horizontal"        android:orientation="vertical"        android:paddingBottom="@dimen/activity_vertical_margin"        android:paddingLeft="@dimen/activity_horizontal_margin"        android:paddingRight="@dimen/activity_horizontal_margin"        android:paddingTop="@dimen/activity_vertical_margin" >    </LinearLayout>    <!-- Login progress -->    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:focusable="true"        android:focusableInTouchMode="true"        android:gravity="center_horizontal"        android:orientation="vertical"        android:paddingBottom="@dimen/activity_vertical_margin"        android:paddingLeft="@dimen/activity_horizontal_margin"        android:paddingRight="@dimen/activity_horizontal_margin"        android:paddingTop="@dimen/activity_vertical_margin" >        <ImageView            android:id="@+id/img"            android:layout_width="140dip"            android:layout_height="55dip"            android:layout_marginTop="60dip"            android:background="@drawable/introshop" />        <TextView            android:layout_width="300dip"            android:layout_height="20dip"            android:layout_marginLeft="20dip"            android:layout_marginTop="5dip"            android:text="立即注册，开始享受高效率的购物生活。"            android:textColor="#FFFFFF"            android:textSize="15dip" />        <ProgressBar            android:id="@+id/login_progress"            style="?android:attr/progressBarStyleLarge"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginBottom="8dp"            android:visibility="gone" />        <ScrollView            android:id="@+id/login_form"            android:layout_width="match_parent"            android:layout_height="match_parent" >            <LinearLayout                android:id="@+id/email_login_form"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:layout_marginTop="10dip"                android:orientation="vertical" >                <EditText                    android:id="@+id/user_edittext"                    android:layout_width="300dip"                    android:layout_height="50dip"                    android:layout_marginLeft="10dip"                    android:hint="手机号"                    android:textColor="#FFFFFF" />                <EditText                    android:id="@+id/password_edittext"                    android:layout_width="300dip"                    android:layout_height="50dip"                    android:layout_marginLeft="10dip"                    android:hint="密码"                    android:password="true"                    android:textColor="#FFFFFF" />                <Button                    android:id="@+id/register_button"                    android:layout_width="300dip"                    android:layout_height="wrap_content"                    android:layout_marginLeft="10dip"                    android:layout_marginTop="40dip"                    android:background="@drawable/shape2"                    android:text="@string/action_register"                    android:textColor="#FFFFFF"                    android:textStyle="bold" />                <TextView                    android:layout_width="120dip"                    android:layout_height="40dip"                    android:layout_marginLeft="117dip"                    android:layout_marginTop="200dip"                    android:text="《用户协议》"                    android:textColor="#595959"                    android:textSize="17dip"                    android:textStyle="italic" />            </LinearLayout>        </ScrollView>    </LinearLayout></FrameLayout>

绑定的Fragement：

package com.example.weixin;import java.io.IOException;import java.io.UnsupportedEncodingException;import java.security.MessageDigest;import java.security.NoSuchAlgorithmException;import java.util.ArrayList;import java.util.List;import org.apache.http.HttpResponse;import org.apache.http.NameValuePair;import org.apache.http.client.ClientProtocolException;import org.apache.http.client.HttpClient;import org.apache.http.client.entity.UrlEncodedFormEntity;import org.apache.http.client.methods.HttpPost;import org.apache.http.impl.client.DefaultHttpClient;import org.apache.http.message.BasicNameValuePair;import org.apache.http.protocol.HTTP;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.View.OnClickListener;import android.view.ViewGroup;import android.widget.Button;import android.widget.EditText;public class registerFragement extends Fragment {    private EditText userEditText = null;    private EditText passwordEditText = null;    private Button registerButton = null;    private String md5password = null;    private HttpClient httpClient = null;    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,            Bundle savedInstanceState) {        View rootvView2 = inflater.inflate(R.layout.registerfragement,                container, false);        httpClient = new DefaultHttpClient();        userEditText = (EditText) rootvView2.findViewById(R.id.user_edittext);        passwordEditText = (EditText) rootvView2                .findViewById(R.id.password_edittext);        registerButton = (Button) rootvView2.findViewById(R.id.register_button);        registerButton.setOnClickListener(new OnClickListener() {            @Override            public void onClick(View v) {                // TODO Auto-generated method stub                md5password = getMD5(passwordEditText.getText().toString());                new Thread() {                    @Override                    public void run() {                        // TODO Auto-generated method stub                        try {                            HttpPost post = new HttpPost(                                    "http://192.168.191.3:8080/DSDG/userRegist");                            List<NameValuePair> parmas = new ArrayList<NameValuePair>();                            parmas.add(new BasicNameValuePair("username",                                    userEditText.getText().toString()));                            parmas.add(new BasicNameValuePair("password",                                    md5password));                            post.setEntity(new UrlEncodedFormEntity(parmas,                                    HTTP.UTF_8));                            HttpResponse response = httpClient.execute(post);                        } catch (UnsupportedEncodingException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        } catch (ClientProtocolException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        } catch (IOException e) {                            // TODO Auto-generated catch block                            e.printStackTrace();                        }                    }                }.start();            }        });        return rootvView2;    }    public String getMD5(String info) {        try {            MessageDigest md5 = MessageDigest.getInstance("MD5");            md5.update(info.getBytes("UTF-8"));            byte[] encryption = md5.digest();            StringBuffer strBuf = new StringBuffer();            for (int i = 0; i < encryption.length; i++) {                if (Integer.toHexString(0xff & encryption[i]).length() == 1) {                    strBuf.append("0").append(                            Integer.toHexString(0xff & encryption[i]));                } else {                    strBuf.append(Integer.toHexString(0xff & encryption[i]));                }            }            return strBuf.toString();        } catch (NoSuchAlgorithmException e) {            return "";        } catch (UnsupportedEncodingException e) {            return "";        }    }}

本文原创，转载请注明出处，谢谢！