首页 > 代码库 > android项目 之 来电管家（1） ----- 界面设计
android项目 之 来电管家（1） ----- 界面设计
因为需要，最近几天忙着写来电管家这个小软件，现在已经基本写的差不多了，基本的功能也都已实现，就剩下后续的完善了，而之前的记事本项目最近几天没写，但是肯定还是会完成的。
来电管家的基本功能，这里主要做的是拦截。
1. 添加黑白名单
2. 选择拦截模式
3. 启用拦截时间段
4. 拦截开关
主要功能，就是通过用户选择开启拦截，并选择拦截模式，这时就会启动后台监听服务，监听来电，判断是否挂断，并且，用户可以自由选择拦截时间段，也就是在该时间段内才启用监听服务。
先来看界面：
从界面其实也可以看出，这里主要应用了ActivityGroup和Activity的组合使用，以达到分页标签的作用，类似很多软件，如QQ。
直接上代码：
main.xml 这个就是ActivityGroup的布局文件，图中的四个页面就是四个Activity，就位于主布局文件中的LinearLayout容器中
<?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:layout_height="fill_parent" > <RelativeLayout android:layout_height="fill_parent" android:layout_width="fill_parent"> <GridView android:layout_height="35dp" android:id="@+id/gvTopBar" android:layout_alignParentTop="true" android:layout_width="fill_parent" android:background="@drawable/tabbar_bg" android:layout_centerVertical="true" > </GridView> <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/gvTopBar" android:src=http://www.mamicode.com/"@drawable/line">其中GridView用于放置顶部的分布菜单，ImageView就是图中的虚线，而最下面的LinearLayout则是放置四个页面的容器。
下面给出四个页面的布局文件
黑白名单页面布局文件 activity_add.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:id="@+id/layout" > <ListView android:id="@+id/lv_show" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1" android:cacheColorHint="#FFF" > </ListView> <RelativeLayout android:id="@+id/add_layout" android:layout_width="fill_parent" android:layout_height="50dp" android:layout_alignParentBottom="true" android:visibility="visible" android:background="@drawable/tabbar_bg" > <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:src=http://www.mamicode.com/"@drawable/line">
拦截记录的布局文件activity_callInfo.xml
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <ListView android:id="@+id/lv_show_callInfo" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1" > </ListView> <RelativeLayout android:id="@+id/add_layout" android:layout_width="fill_parent" android:layout_height="50dp" android:layout_alignParentBottom="true" android:visibility="visible" android:background="@drawable/tabbar_bg" > <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:src=http://www.mamicode.com/"@drawable/line">
设置页面的布局文件activity_setting.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <RelativeLayout android:layout_width="match_parent" android:layout_height="40dp" android:gravity="center" android:padding="8dp" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:layout_marginTop="30dp" android:background="@drawable/setting_top" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="开启监听" android:textSize="15sp" /> <ToggleButton android:id="@+id/tb_switch" android:layout_width="44dp" android:layout_height="20dp" android:background="@drawable/start_service_off" android:textOff="" android:textOn="" android:layout_alignParentRight="true" /> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="40dp" android:gravity="center" android:padding="8dp" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:background="@drawable/setting_middle" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="白名单模式" android:textSize="15sp" /> <ToggleButton android:id="@+id/tb_whitelist" android:layout_width="44dp" android:layout_height="20dp" android:background="@drawable/start_service_off" android:textOff="" android:textOn="" android:layout_alignParentRight="true" /> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="40dp" android:gravity="center" android:padding="8dp" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:background="@drawable/setting_middle" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="启用时间段" android:textSize="15sp" /> <ToggleButton android:id="@+id/tb_time" android:layout_width="44dp" android:layout_height="20dp" android:background="@drawable/start_service_off" android:textOff="" android:textOn="" android:layout_alignParentRight="true" /> </RelativeLayout> <RelativeLayout android:id="@+id/start_layout" android:layout_width="match_parent" android:layout_height="40dp" android:gravity="center" android:padding="8dp" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:background="@drawable/setting_middle" > <TextView android:id="@+id/tv_start_tip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="开始时间 " android:textSize="15sp" android:textColor="@android:color/darker_gray" /> <TextView android:id="@+id/tv_start_time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2014-9-11 >" android:textSize="15sp" android:layout_alignParentRight="true" android:textColor="@android:color/darker_gray" /> </RelativeLayout> <RelativeLayout android:id="@+id/end_layout" android:layout_width="match_parent" android:layout_height="40dp" android:gravity="center" android:padding="8dp" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:background="@drawable/setting_under" > <TextView android:id="@+id/tv_end_tip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="结束时间 " android:textSize="15sp" android:textColor="@android:color/darker_gray" /> <TextView android:id="@+id/tv_end_time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="2014-9-11 >" android:textSize="15sp" android:layout_alignParentRight="true" android:textColor="@android:color/darker_gray" /> </RelativeLayout> </LinearLayout>图中设置页面中的四周包围的线，其实是用到了.9.png图片。
布局文件就上面这几个，那么顶部的分页菜单，及如何将四个Activity添加进ActivityGroup中。1）顶部菜单的实现：
既然是GridView，当然要用适配器了，这里用的是自定义BaseAdapter，如下：
package com.example.callmanager;import android.app.Activity;import android.content.Context;import android.content.SharedPreferences;import android.view.Gravity;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.GridView;import android.widget.TextView;public class TabBarAdapter extends BaseAdapter { private Context mContext; private TextView[] txtItems; private int selResId; public TabBarAdapter(Context c,int[] tabMenuId,int width,int height,int selResId) { mContext = c; this.selResId=selResId; txtItems=new TextView[tabMenuId.length]; for(int i=0;i<tabMenuId.length;i++) { txtItems[i] = new TextView(mContext); txtItems[i].setLayoutParams(new GridView.LayoutParams(width, GridView.LayoutParams.WRAP_CONTENT));//设置ImageView宽高 txtItems[i].setGravity(Gravity.CENTER); txtItems[i].setPadding(2, 5, 2, 5); txtItems[i].setText(tabMenuId[i]); txtItems[i].setTextSize(15); } } public int getCount() { return txtItems.length; } public Object getItem(int position) { return position; } public long getItemId(int position) { return position; } /** * 设置选中的效果 */ public void SetFocus(int index) { for(int i=0;i<txtItems.length;i++) { if(i!=index) { txtItems[i].setBackgroundResource(0);//恢复未选中的样式 } } txtItems[index].setBackgroundResource(selResId);//设置选中的样式 } public View getView(int position, View convertView, ViewGroup parent) { TextView textView; if (convertView == null) { textView = txtItems[position]; } else { textView = (TextView) convertView; } return textView; } }接下来就是将自定义的Adapter与GridView进行绑定了，主要代码如下（位于ActivityGroupDemo.java中）：
public GridView gvTopBar;private TabBarAdapter topImgAdapter;/** 顶部菜单 **/<br abp="804" /> int[] topbar_menu_array = { R.string.black_list,R.string.white_list,<br abp="805" /> R.string.call_info,<br abp="806" /> R.string.setting };@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); gvTopBar = (GridView) this.findViewById(R.id.gvTopBar); gvTopBar.setNumColumns(topbar_menu_array.length);// 设置每行列数 gvTopBar.setSelector(new ColorDrawable(Color.TRANSPARENT));// 选中的时候为透明色 gvTopBar.setGravity(Gravity.CENTER);// 位置居中 int width = this.getWindowManager().getDefaultDisplay().getWidth() / topbar_menu_array.length; topImgAdapter = new TabBarAdapter(this, topbar_menu_array, width, 48, R.drawable.menu_background); gvTopBar.setAdapter(topImgAdapter);// 设置菜单Adapter }这样，顶部菜单的功能就已完成，并且，你点击某个菜单时，会有选中时的效果，如图中所示，这里同样使用的是.9.png图片。
2）将四个Activity添加进ActivityGroup,并点击相应的分布标签，进入对应的activity，四个Activity的代码不用多说，就是加载布局文件而已，主要看activityGroup中代码：
public LinearLayout container;// 装载sub Activity的容器<pre class="java" name="code" abp="813"> gvTopBar.setOnItemClickListener(new ItemClickEvent());// 项目点击事件 container = (LinearLayout) findViewById(R.id.Container); SwitchActivity(0);//默认打开第0页class ItemClickEvent implements OnItemClickListener { @SuppressLint("NewApi") public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) { SwitchActivity(arg2); } } /** * 根据ID打开指定的Activity * @param id GridView选中项的序号 */ void SwitchActivity(int id) { topImgAdapter.SetFocus(id);//选中项获得高亮 container.removeAllViews();//必须先清除容器中所有的View Intent intent =null; if (id == 0 ) intent = new Intent(ActivityGroupDemo.this, BlackListActivity.class); else if (id == 1) intent = new Intent(ActivityGroupDemo.this,WhiteListActivity.class); else if (id == 2) intent = new Intent(ActivityGroupDemo.this, CallInfo.class); else if (id == 3) intent = new Intent(ActivityGroupDemo.this, SettingActivity.class); intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP); //Activity 转为 View Window subActivity = getLocalActivityManager().startActivity( "subActivity", intent); //容器添加View container.addView(subActivity.getDecorView(), LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT); }其实，就是利用Intent跳转页面，并将viiew添加进窗口中。
至此，界面设计部分已完成。
android项目 之 来电管家（1） ----- 界面设计
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。