最终效果如下图,点击菜单会切换Activity,有动画效果。
从早上起床就研究这个东西,因为之前一直都直接用系统提供的几个控件,从来没搞过图片背景、嵌套布局什么的,今天是第一次,没什么经验,花了一个上午才搞定。
简单介绍一下思路,使用LinearLayout嵌套,分三部分,第一部分是顶部的标题栏,第二部分是内容,第三部分是底部菜单。参考网上的代码,一路顺风顺水搞定,但在模拟器测试时出了问题(开发时用I9000),模拟器的屏幕是HVGA的,在上面运行看不到菜单栏。这个问题困扰了很久,网上也搜不出有用的答案(说是用dip,不用px,我开始就是用dip的),最后还是自己冥思苦想解决了问题,解决方法也很简单,就是让内容fill_parent,然后菜单layout_marginTop取个负值。
main.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:gravity="clip_horizontal" android:layout_height="fill_parent" android:id="@+id/toplayout"> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="30dip" android:background="@drawable/header" android:gravity="center"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/toptv" android:gravity="center" android:textSize="20dip" android:layout_gravity="center" android:text="@string/home"/> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:layout_width="wrap_content" android:gravity="center" android:textSize="20dip" android:layout_gravity="center" android:text="@string/home" android:layout_height="fill_parent"/> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_marginTop="-50dip" android:layout_height="50dip" android:gravity="bottom" android:background="@drawable/header"> <include layout="@layout/foot" /> </LinearLayout> </LinearLayout>
foot.xml:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="80dip" android:layout_height="80dip" android:id="@+id/home" android:gravity="center_horizontal" > <TextView android:layout_width="wrap_content" android:layout_height="50dip" android:gravity="center" android:paddingTop="29dip" android:background="@drawable/tab_home" android:id="@+id/hometv" /> </LinearLayout> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/line" /> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="80dip" android:layout_height="wrap_content" android:gravity="center_horizontal" android:id="@+id/channel"> <TextView android:layout_width="wrap_content" android:layout_height="50dip" android:gravity="center" android:paddingTop="29dip" android:background="@drawable/tab_channel" android:id="@+id/channeltv" /> </LinearLayout> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/line" /> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="80dip" android:id="@+id/fav" android:layout_height="wrap_content" android:gravity="center_horizontal" > <TextView android:layout_width="wrap_content" android:layout_height="50dip" android:gravity="center" android:paddingTop="29dip" android:background="@drawable/tab_fav" android:id="@+id/favtv" /> </LinearLayout> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/line" /> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="80dip" android:id="@+id/search" android:layout_height="wrap_content" android:gravity="center_horizontal"> <TextView android:layout_width="wrap_content" android:layout_height="50dip" android:gravity="center" android:paddingTop="29dip" android:background="@drawable/tab_search" android:id="@+id/searchtv"/> </LinearLayout> </LinearLayout> |
main.java:
package com.BottomMenu;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.LinearLayout;
import android.widget.TextView;
public class main extends Activity {
private LinearLayout home, channel, fav, search;
TextView toptv;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.main);
Init();
}
public void Init(){
Animation anim = AnimationUtils.loadAnimation(this,R.anim.scale);
findViewById(R.id.toplayout).startAnimation(anim);
//这两行是启动activity的动画效果
home = (LinearLayout) findViewById(R.id.home);
TextView hometv=(TextView)home.findViewById(R.id.hometv);
hometv.setBackgroundResource(R.drawable.tab_home_select);
home.setBackgroundResource(R.drawable.tab_two_highlight);
toptv=(TextView)findViewById(R.id.toptv);
channel = (LinearLayout) findViewById(R.id.channel);
channel.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Intent intent=new Intent();
intent.setClass(main.this, channel.class);
main.this.startActivity(intent);
}
});
fav = (LinearLayout) findViewById(R.id.fav);
fav.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Intent intent=new Intent();
intent.setClass(main.this, fav.class);
main.this.startActivity(intent);
}
});
search = (LinearLayout) findViewById(R.id.search);
search.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Intent intent=new Intent();
intent.setClass(main.this, search.class);
main.this.startActivity(intent);
}
});
};
}
动画效果scale.xml:
1 2 3 4 5 6 7 8 9 10 11 | <set xmlns:android="http://schemas.android.com/apk/res/android"> <scale android:interpolator="@android:anim/decelerate_interpolator" android:fromXScale="0.0" android:toXScale="1.0" android:fromYScale="0.0" android:toYScale="1.0" android:pivotX="50%" android:pivotY="50%" android:fillAfter="true" android:duration="300" /> </set> |
其他几个activity代码就不贴了,反正内容都一样,下面有代码打包供大家参考。 BottomMenu (275)