Let's continue with the android menu today. Previously we introduced: I believe everyone is familiar with the Metro style. Here we will implement this effect on the Android platform,
Implementation ideas:
Animation is used to achieve the moving effect. The TranslateAnimation method is used. Take a look at the layout file:
Activity_main.xml
Copy codeThe Code is as follows: <? 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">
<! -- First layer -->
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
Android: layout_weight = "1"
Android: orientation = "horizontal">
<! -- Level 1 Horizontal -->
<! -- Horizontal left of the first layer -->
<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>
<! -- Horizontal right of the first layer -->
<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>
<! -- Layer 2 -->
<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>
Its effect is as follows:
After that, you can perform animation movement on each Layout in MainActivity to achieve the translation effect.
MainActivity. java:Copy codeThe Code is as follows: 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 ();
}
// Start the animation
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 );
}
// Animation Definition
Private void myAnimation (){
DisplayMetrics displayMetrics = new DisplayMetrics ();
DisplayMetrics = this. getResources (). getDisplayMetrics ();
// Obtain the screen width
Int screenWidth = displayMetrics. widthPixels;
// Obtain the screen height
Int screenHeight = displayMetrics. heightPixels;
MyAnimation_Right = new TranslateAnimation (screenWidth, 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 );
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;
}
}
Although the effect is acceptable, the layout file is nested, which leads to performance problems when drawing windows. Therefore, you have strict program requirements. We recommend that you use RelativewLayout for layout and reduce nesting.