Is a man next layer 100 [the first layer] -- high imitation WeChat interface (7)

In the previous article "men are the next layer [the first layer] -- high imitation interface (6)", we have implemented various menus on the main interface, next we will complete two interesting functions: one is the upper and lower pop-up menus and the other is the shake function.

The effect is as follows:

Let's first create a dialog box on the top right. The layout code is very simple. The layout is a relative layout and a linear layout inside. The layout is as follows:

<? Xml version = "1.0" encoding = "UTF-8"?> <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "fill_parent" android: layout_height = "fill_parent"> <RelativeLayout android: layout_width = "fill_parent" android: layout_height = "fill_parent" android: layout_marginTop = "46dp"> <LinearLayout android: id = "@ + id/main_dialog_layout" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_alignParentRight = "true" android: layout_alignParentTop = "true" android: orientation = "vertical" android: background = "@ drawable/title_function_bg"> <LinearLayout android: layout_width = "match_parent" android: layout_height = "wrap_content"> <ImageView android: id = "@ + id/imageView1" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_gravity = "center_vertical" android: layout_marginLeft = "8dp" android: src = "@ drawable/mm_title_btn_compose_normal"/> <TextView android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: padding = "8dp" android: text = "initiate chat" android: textColor = "# fff" android: textSize = "18sp"/> </LinearLayout> <LinearLayout android: layout_width = "match_parent" android: layout_height = "wrap_content"> <ImageView android: id = "@ + id/imageView2" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_gravity = "center_vertical" android: layout_marginLeft = "8dp" android: src = "@ drawable/resize"/> <TextView android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: padding = "8dp" android: text = "receiver mode" android: textColor = "# fff" android: textSize = "18sp"/> </LinearLayout> <LinearLayout android: layout_width = "match_parent" android: layout_height = "wrap_content"> <ImageView android: id = "@ + id/imageView3" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_gravity = "center_vertical" android: layout_marginLeft = "8dp" android: src = "@ drawable/mm_title_btn_keyboard_normal"/> <TextView android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: padding = "8dp" android: text = "Login webpage version" android: textColor = "# fff" android: textSize = "18sp"/> </LinearLayout> <LinearLayout android: layout_width = "match_parent" android: layout_height = "wrap_content"> <ImageView android: id = "@ + id/imageView4" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_gravity = "center_vertical" android: layout_marginLeft = "8dp" android: src = "@ drawable/resize"/> <TextView android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: padding = "8dp" android: text = "scan" android: textColor = "# fff" android: textSize = "18sp"/> </LinearLayout> </RelativeLayout>

Effect:

This background is black because of the theme. Since there is a theme, can we modify the theme to make the background transparent? The answer is feasible.

Custom theme styles (for custom theme, see my other blog: http://blog.csdn.net/dawanganban/article/details/17732701)

<Style name = "MyDialogStyleTop" parent = "android: Theme. dialog "> <item name =" android: windowAnimationStyle "> @ style/AnimTop2 </item> <item name =" android: windowFrame "> @ null </item> <! -- Border --> <item name = "android: windowIsFloating"> true </item> <! -- Whether to float above activity --> <item name = "android: Movie wistranslucent"> true </item> <! -- Translucent --> <item name = "android: windowNoTitle"> true </item> <! -- No title --> <item name = "android: windowBackground"> @ android: color/transparent </item> <! -- Background transparency --> <item name = "android: backgroundDimEnabled"> false </item> <! -- Fuzzy --> </style>

Switch Animation

    <style name="AnimTop2" parent="@android:style/Animation">      <item name="android:windowEnterAnimation">@anim/push_top_in2</item>        <item name="android:windowExitAnimation">@anim/push_top_out2</item>    </style>

<? Xml version = "1.0" encoding = "UTF-8"?> <! -- Slide-in --> <scale xmlns: android = "http://schemas.android.com/apk/res/android" android: interpolator = "@ android: anim/accelerate_decelerate_interpolator" android: fromXScale = "1.0" android: toXScale = "1.0" android: fromYScale = "0" android: toYScale = "1.0" android: Large Tx = "0" android: Large ty = "10%" android: duration = "200"/>

<?xml version="1.0" encoding="utf-8"?><scale   xmlns:android="http://schemas.android.com/apk/res/android"        android:interpolator="@android:anim/accelerate_decelerate_interpolator"          android:fromXScale="1.0"           android:toXScale="1.0"           android:fromYScale="1.0"           android:toYScale="0"           android:pivotX="0"          android:pivotY="10%"          android:duration="200" /> 

Set a topic for the Activity

        <activity android:name="com.example.weixin.activity.MainTopRightDialog" android:theme="@style/MyDialogStyleTop">                    </activity>

After setting the topic style, the running result is the same as that of the first image. Here we will not map it, but how to make this menu disappear after running will require rewriting onTouchEvent. The code in the Activity is as follows:

Package com. example. weixin. activity; import android. app. activity; import android. OS. bundle; import android. view. motionEvent; import android. view. view; import android. view. view. onClickListener; import android. widget. linearLayout; import android. widget. toast; import com. example. weixin. r; public class MainTopRightDialog extends Activity {// private MyDialog dialog; private LinearLayout layout; @ Overrideprotected Void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. main_top_right_dialog); // dialog = new MyDialog (this); layout = (LinearLayout) findViewById (R. id. main_dialog_layout); layout. setOnClickListener (new OnClickListener () {@ Overridepublic void onClick (View v) {// TODO Auto-generated method stubToast. makeText (getApplicationContext (), "prompt: Click the window to close the window! ", Toast. LENGTH_SHORT). show () ;}}) ;}@ Overridepublic boolean onTouchEvent (MotionEvent event) {finish (); return true ;}}

In this way, the pop-up menu above is implemented.

In the next article, let's take a look at how to implement the shake function, not just the implementation, but the same as the above (the code is posted in the next article ).