当前位置: 移动技术网 > IT编程>移动开发>Android > Android Metro菜单实现思路及代码

Android Metro菜单实现思路及代码

2019年07月24日  | 移动技术网IT编程  | 我要评论

四象数独,伊利奶粉官方网,展览路少年宫

今天继续说一下安卓的菜单,之前介绍了:相信大家对于metro风格并不陌生,下面就在安卓平台上实现一下这个效果,如图:
 
实现思路:
利用动画来实现移动的效果,使用的是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" >
<!-- 1 -->
<relativelayout
android:id="@+id/nine_one"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffff00" >
</relativelayout>
<!-- 2 -->
<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>
<!-- 4 -->
<relativelayout
android:id="@+id/nine_four"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ee30a7" >
</relativelayout>
<!-- 5 -->
<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" >
<!-- 3 -->
<relativelayout
android:id="@+id/nine_three"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:background="#ff8c69" >
</relativelayout>
<!-- 6 -->
<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" >
<!-- 7 -->
<relativelayout
android:id="@+id/nine_seven"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#8b3e2f" >
</relativelayout>
<!-- 8 -->
<!-- 9 -->
<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>

它的效果是这样的:
 
之后在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来布局,并且减少使用嵌套。

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网