Android Metro菜单实现思路及代码
Android Metro菜单实现思路及代码
发布时间:2017-01-07 来源:查字典编辑
摘要:今天继续说一下安卓的菜单,之前介绍了:相信大家对于Metro风格并不陌生,下面就在安卓平台上实现一下这个效果,如图:实现思路:利用动画来实现...

今天继续说一下安卓的菜单,之前介绍了:相信大家对于Metro风格并不陌生,下面就在安卓平台上实现一下这个效果,如图:

1

实现思路:

利用动画来实现移动的效果,使用的是TranslateAnimation这个方法。先看一下布局文件:

activity_main.xml

复制代码 代码如下:

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:background="#000000"

android:orientation="vertical" >

<>

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:orientation="horizontal" >

<>

<>

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:orientation="vertical" >

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:orientation="horizontal" >

<>

<RelativeLayout

android:id="@+id/nine_one"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#FFFF00" >

</RelativeLayout>

<>

<RelativeLayout

android:id="@+id/nine_two"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#FFC0CB" >

</RelativeLayout>

</LinearLayout>

<>

<RelativeLayout

android:id="@+id/nine_four"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#EE30A7" >

</RelativeLayout>

<>

<RelativeLayout

android:id="@+id/nine_five"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#EE4000" >

</RelativeLayout>

</LinearLayout>

<>

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="2"

android:orientation="vertical" >

<>

<RelativeLayout

android:id="@+id/nine_three"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="2"

android:background="#FF8C69" >

</RelativeLayout>

<>

<RelativeLayout

android:id="@+id/nine_six"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#8C8C8C" >

</RelativeLayout>

</LinearLayout>

</LinearLayout>

<>

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="3"

android:baselineAligned="false"

android:orientation="horizontal" >

<>

<RelativeLayout

android:id="@+id/nine_seven"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#8B3E2F" >

</RelativeLayout>

<>

<>

<RelativeLayout

android:id="@+id/nine_nine"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1"

android:background="#A52A2A" >

</RelativeLayout>

</LinearLayout>

</LinearLayout>

它的效果是这样的:

2

之后在MainActivity里面对每一个Layout进行动画移动就可以实现平移的效果了。

MainActivity.java:

复制代码 代码如下:

import android.app.Activity;

import android.content.Intent;

import android.os.Bundle;

import android.util.DisplayMetrics;

import android.view.LayoutInflater;

import android.view.Menu;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.Window;

import android.view.animation.TranslateAnimation;

import android.widget.RelativeLayout;

import android.widget.Toast;

/**

*

*/

public class MainActivity extends Activity {

private View viewNine;

private LayoutInflater inflater;

private RelativeLayout nine_one, nine_two, nine_three, nine_four,

nine_five, nine_six, nine_seven, nine_nine;

private TranslateAnimation myAnimation_Right, myAnimation_Bottom;

private TranslateAnimation myAnimation_Left, myAnimation_Top;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

inflater = LayoutInflater.from(this);

viewNine = inflater.inflate(R.layout.activity_main, null);

nine_one = (RelativeLayout) viewNine.findViewById(R.id.nine_one);

nine_two = (RelativeLayout) viewNine.findViewById(R.id.nine_two);

nine_three = (RelativeLayout) viewNine.findViewById(R.id.nine_three);

nine_four = (RelativeLayout) viewNine.findViewById(R.id.nine_four);

nine_five = (RelativeLayout) viewNine.findViewById(R.id.nine_five);

nine_six = (RelativeLayout) viewNine.findViewById(R.id.nine_six);

nine_seven = (RelativeLayout) viewNine.findViewById(R.id.nine_seven);

nine_nine = (RelativeLayout) viewNine.findViewById(R.id.nine_nine);

setContentView(viewNine);

nine_four.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

Intent intent=new Intent(MainActivity.this,OneActivity.class);

startActivity(intent);

}

});

nine_six.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

}

});

myAnimation();

addAnimation();

}

// 启动动画

private void addAnimation() {

nine_one.startAnimation(myAnimation_Right);

nine_two.startAnimation(myAnimation_Bottom);

nine_three.startAnimation(myAnimation_Left);

nine_four.startAnimation(myAnimation_Bottom);

nine_five.startAnimation(myAnimation_Left);

nine_six.startAnimation(myAnimation_Top);

nine_seven.startAnimation(myAnimation_Left);

nine_nine.startAnimation(myAnimation_Left);

}

// 动画定义

private void myAnimation() {

DisplayMetrics displayMetrics = new DisplayMetrics();

displayMetrics = this.getResources().getDisplayMetrics();

// 获得屏幕宽度

int screenWidth = displayMetrics.widthPixels;

// 获得屏幕高度

int screenHeight = displayMetrics.heightPixels;

myAnimation_Right = new TranslateAnimation(screenWidth, 0, 0, 0);

myAnimation_Right.setDuration(1800);

myAnimation_Bottom = new TranslateAnimation(0, 0, screenHeight, 0);

myAnimation_Bottom.setDuration(1500);

myAnimation_Left = new TranslateAnimation(-screenWidth, 0, 0, 0);

myAnimation_Left.setDuration(2000);

myAnimation_Top = new TranslateAnimation(0, 0, -screenHeight, 0);

myAnimation_Top.setDuration(2500);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

// getMenuInflater().inflate(R.menu.activity_main, menu);

return true;

}

}

虽然效果还可以,但是布局文件由于使用嵌套,这样毁造成绘制窗口时性能的问题。所以你对程序要求很严格,那么建议使用RelativewLayout来布局,并且减少使用嵌套。

下载地址

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新安卓软件开发学习
热门安卓软件开发学习
编程开发子分类