Sample Code of the menu at the bottom of the Android imitation QQ space

Source: Internet
Author: User

I used to see the Demo at the bottom of the Android imitation QQ space on the Internet. I found that this Demo has many bugs and many mysterious figures are used for layout. So I studied the implementation of the menu at the bottom of the QQ space and wrote one for your reference. Shows the effect:

1. The implementation principle is very simple. The bottom menu is a horizontally distributed LinearLayout, which contains five LinearLayout. Their layout_weight values are 1, this means that the sub-control of the bottom menu divides the screen width equally into five parts. Five LinearLayout except the middle one, all others are placed in the ImageView and TextView (the middle is empty first, nothing is put, followed by the chassis and the plus sign ).
2. the plus sign in the center and the chassis are implemented using FramLayout. Now, the base is placed at the center of the bottom, and the plus sign is placed at the same position.
3. Set the touch event of the plus sign. The pop-up window is implemented using PopupWindow, and then replace the image of the plus sign with the multiplication number. The Code is as follows:
ButtomMenuActivity. java: Copy codeThe Code is as follows: package com. shamoo. qqbuttommenu;
Import com. shamoo. qqbuttommenu. R;
Import android. app. TabActivity;
Import android. content. Context;
Import android. content. Intent;
Import android. graphics. Color;
Import android. graphics. drawable. BitmapDrawable;
Import android. OS. Bundle;
Import android. view. Gravity;
Import android. view. LayoutInflater;
Import android. view. MotionEvent;
Import android. view. View;
Import android. view. View. OnClickListener;
Import android. view. View. OnTouchListener;
Import android. view. WindowManager;
Import android. widget. AbsListView;
Import android. widget. FrameLayout;
Import android. widget. ImageView;
Import android. widget. LinearLayout;
Import android. widget. PopupWindow;
Import android. widget. PopupWindow. OnDismissListener;
Import android. widget. RadioButton;
Import android. widget. TabHost;
Public class ButtomMenuActivity extends TabActivity {
FrameLayout fmpan;
TabHost tabHost;
ImageView image;
FrameLayout fm;
LayoutInflater inflater;
Private RadioButton tab_home, tab_second;
PopupWindow popup;

Public void onCreate (Bundle savedInstanceState ){
Super. onCreate (savedInstanceState );
SetContentView (R. layout. tab );
InitView ();
Fm. setOnClickListener (new OnClickListener (){
Public void onClick (View v ){
Image. setImageResource (R. drawable. toolbar_plusback );
ShowWindow (fmpan );
}
});
}
Private void initView (){
Inflater = (LayoutInflater) this. getSystemService (Context. LAYOUT_INFLATER_SERVICE );
Fmpan = (FrameLayout) findViewById (R. id. tab1 );
Fm = (FrameLayout) findViewById (R. id. btn_ck );
Image = (ImageView) findViewById (R. id. image1 );
}

Private void showWindow (View parent ){
If (popup = null ){
LayoutInflater layoutInflater = (LayoutInflater) getSystemService (Context. LAYOUT_INFLATER_SERVICE );
View view = layoutInflater. inflate (R. layout. write_tab, null );
// Create a PopuWidow object
Popup = new PopupWindow (view, LinearLayout. LayoutParams. MATCH_PARENT, 320 );
// Set the focus on the pop-up window
Popup. setFocusable (true );
// Set to allow click to disappear
Popup. setOutsideTouchable (true );
// Set the event listening for the disappearance of the pop-up window
Popup. setOnDismissListener (new OnDismissListener (){
Public void onDismiss (){
// TODO Auto-generated method stub
Image. setImageResource (R. drawable. toolbar_plus );
}
});
// Click "Back" to make it disappear without affecting your background.
Popup. setBackgroundDrawable (new BitmapDrawable ());
Popup. setTouchInterceptor (new OnTouchListener (){
Public boolean onTouch (View view, MotionEvent event ){
If (event. getAction () = MotionEvent. ACTION_OUTSIDE ){
Popup. dismiss ();
Image. setImageResource (R. drawable. toolbar_plus );
Return true;
}
Return false;
}
});
}
If (! Popup. isShowing ()){
Popup. showAsDropDown (parent, Gravity. CENTER, 0 );
}
}
}

Tab. xml:Copy codeThe Code is as follows: <? Xml version = "1.0" encoding = "UTF-8"?>
<TabHost xmlns: android = "http://schemas.android.com/apk/res/android"
Android: id = "@ android: id/tabhost"
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent">
<FrameLayout
Android: id = "@ + id/l1"
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent">
<FrameLayout
Android: id = "@ android: id/tabcontent"
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
/>
<TabWidget
Android: id = "@ android: id/tabs"
Android: layout_width = "fill_parent"
Android: layout_height = "10.0px"
Android: visibility = "gone"/>
<RelativeLayout
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent">
<Include
Android: layout_alignParentBottom = "true"
Android: id = "@ + id/tab1"
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Layout = "@ layout/test"/>
</RelativeLayout>
</FrameLayout>
</TabHost>

Test. xml:Copy codeThe Code is as follows: <? Xml version = "1.0" encoding = "UTF-8"?>
<FrameLayout xmlns: android = "http://schemas.android.com/apk/res/android"
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: background = "@ drawable/toolbar_bg">
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: layout_gravity = "bottom"
Android: gravity = "center_horizontal"
Android: orientation = "horizontal">
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: orientation = "vertical"
Android: layout_weight = "1">
<ImageView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "top | center"
Android: src = "@ drawable/tab_timefeed_opacity"
Android: visibility = "visible"/>
<TextView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "bottom | center"
Android: text = "friend Dynamics"
Android: textSize = "10.0dip"
Android: visibility = "visible"/>
</LinearLayout>
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: orientation = "vertical"
Android: layout_weight = "1">
<ImageView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "top | center"
Android: src = "@ drawable/tab_feedback_opacity"
Android: visibility = "visible"/>
<TextView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "bottom | center"
Android: text = "related to me"
Android: textSize = "10.0dip"
Android: visibility = "visible"/>
</LinearLayout>
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: orientation = "vertical"
Android: layout_weight = "1"/>
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: orientation = "vertical"
Android: layout_weight = "1">
<ImageView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "top | center"
Android: src = "@ drawable/tab_myzone_opacity"
Android: visibility = "visible"/>
<TextView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "bottom | center"
Android: text = "Homepage"
Android: textSize = "10.0dip"
Android: visibility = "visible"/>
</LinearLayout>
<LinearLayout
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: orientation = "vertical"
Android: layout_weight = "1">
<ImageView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "top | center"
Android: src = "@ drawable/tab_applist_opacity"
Android: visibility = "visible"/>
<TextView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "bottom | center"
Android: text = "app"
Android: textSize = "10.0dip"
Android: visibility = "visible"/>
</LinearLayout>
</LinearLayout>
<FrameLayout
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "center_horizontal"
Android: layout_weight = "1">
<ImageView
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "center"
Android: src = "@ drawable/toolbar_write_bg"/>
</FrameLayout>
<FrameLayout
Android: id = "@ + id/btn_ck"
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "center"
Android: layout_weight = "1">
<ImageView
Android: id = "@ + id/image1"
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: layout_gravity = "center"
Android: layout_marginTop = "2.0dip"
Android: src = "@ drawable/toolbar_plus"/>
</FrameLayout>
</FrameLayout>

This Demo is just like a play, and may not be well written in some places. If you have any questions, I hope you can point them out. Thank you!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.