您的位置:首页 > 移动开发 > Android开发

android 实战练习 回归手机卫士 一 主界面布局

2014-03-23 17:48 393 查看
学习android一年多了,平常都是看着书,然后做些练习,总觉着学了后面,忘了前面,突然想做一个比较完整一点的项目,

于是不自觉地就想到了做这样一个应用,由于刚接触android没多久,程序肯定会存在或多或少的bug

不过现已大体为准吧,把所有的知识整体地复习和应用一遍也是不错的

以下是效果图









 

今天就先上布局了,相关的业务逻辑后续再说吧

其实这也就是简单的fragment+viewpager的整体布局,然后零零散散地加上一些其他诸如ListView,GridView等布局

1.activity_main.xml主界面

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/spalsh_ui"
android:layout_width="match_parent"
android:layout_height="match_parent"
>

<LinearLayout
android:id="@+id/home_title_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentTop="true"
android:background="@color/activity_mian_title">
<ImageView
android:id="@+id/activity_main_home_img"
android:layout_width="40dip"
android:layout_height="45dip"
android:src="@drawable/user_default"
android:contentDescription="@string/home_img"/>
<TextView
android:id="@+id/activity_main_title"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="@string/logo_title"
android:textSize="20sp"
android:gravity="center"
android:layout_gravity="center"
android:textColor="@color/activity_mian_title_text"/>
<ImageButton
android:id="@+id/activity_main_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:src="@drawable/main_menu"
android:contentDescription="@string/home_img"/>
</LinearLayout>

<android.support.v4.view.ViewPager
android:id="@+id/activity_main_viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/home_title_layout"
/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_above="@id/activity_main_viewPager"
android:layout_alignParentBottom="true"
android:background="@color/activity_mian_title">
<TextView
android:id="@+id/activity_main_index"
style="@style/activity_bottom_text"
android:drawableTop="@drawable/menu_index"
android:text="@string/activity_index"/>
<TextView
android:id="@+id/activity_main_youhua"
style="@style/activity_bottom_text"
android:drawableTop="@drawable/menu_youhua"
android:text="@string/activity_youhua"/>
<TextView
android:id="@+id/activity_main_manager"
style="@style/activity_bottom_text"
android:drawableTop="@drawable/menu_manager"
android:text="@string/activity_manager"/>
<TextView
android:id="@+id/activity_main_setting"
style="@style/activity_bottom_text"
android:drawableTop="@drawable/menu_setting"
android:text="@string/activity_setting"/>
</LinearLayout>
</RelativeLayout>


2.activity代码

package cn.edu.gzu.BackPP.activities;

import java.io.File;
import java.util.ArrayList;
import cn.edu.gzu.BackPP.Fragment.IndexFragment;
import cn.edu.gzu.BackPP.Fragment.ManagerFragment;
import cn.edu.gzu.BackPP.Fragment.SettingFragment;
import cn.edu.gzu.BackPP.Fragment.YouhuaFragment;

import android.content.Intent;
import android.os.Bundle;
import android.os.Environment;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.Gravity;
import android.view.KeyEvent;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends FragmentActivity implements OnTouchListener{
private Fragment indexFragment;// 获取到fragment实例
private Fragment youhuaFragment;
private Fragment managerFragment;
private Fragment settingFragment;
private ArrayList<Fragment> myFragments;// 由于存放fragment的集合
private ViewPager viewPager;// 让fragment切换并装载的控件
private TextView indexSwitcher;// 页面底部的四个切换组件
private TextView youhusSwitcher;
private TextView managerSwitcher;
private TextView settingSwitcher;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
// 初始化加载fragment
initFragment();
// 通过id找到组件
findViewById();
//在外部存储sdcard上建立文件夹以便后续保存文件
File fileDir=new File(Environment.getExternalStorageDirectory().getPath()+"/HuiGui/cache");
if(!fileDir.exists()){
fileDir.mkdirs();
}

View view = getWindow().getDecorView();
view.setOnTouchListener(this);

startServices();
}

/**
* 初始化加载fragment
*/
private void initFragment() {
myFragments = new ArrayList<Fragment>();
indexFragment = new IndexFragment();
youhuaFragment = new YouhuaFragment();
managerFragment = new ManagerFragment();
settingFragment = new SettingFragment();

// 将fragment实例添加到集合
myFragments.add(indexFragment);
myFragments.add(youhuaFragment);
myFragments.add(managerFragment);
myFragments.add(settingFragment);

viewPager = (ViewPager) findViewById(R.id.activity_main_viewPager);
viewPager.setAdapter(new MyFragmentAdapter(getSupportFragmentManager(),
myFragments));

viewPager.setCurrentItem(0);

viewPager.setOnPageChangeListener(new OnPageChangeListener() {

@Override
public void onPageSelected(int arg0) {
switch (arg0) {
case 0:
initTitleBG();
indexSwitcher.setBackgroundResource(R.drawable.pressed_bg);
break;
case 1:
initTitleBG();
youhusSwitcher.setBackgroundResource(R.drawable.pressed_bg);
break;
case 2:
initTitleBG();
managerSwitcher.setBackgroundResource(R.drawable.pressed_bg);
break;
case 3:
initTitleBG();
settingSwitcher.setBackgroundResource(R.drawable.pressed_bg);
break;
}
}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {

}

@Override
public void onPageScrollStateChanged(int arg0) {

}
});

};

/**
* 通过id找到组件
*/
private void findViewById() {
indexSwitcher = (TextView) findViewById(R.id.activity_main_index);
youhusSwitcher = (TextView) findViewById(R.id.activity_main_youhua);
managerSwitcher = (TextView) findViewById(R.id.activity_main_manager);
settingSwitcher = (TextView) findViewById(R.id.activity_main_setting);
indexSwitcher.setBackgroundColor(getResources().getColor(
R.color.activity_mian_bottom_selected));

ViewOnClickListener viewOnClickListener = new ViewOnClickListener();
indexSwitcher.setOnClickListener(viewOnClickListener);
youhusSwitcher.setOnClickListener(viewOnClickListener);
managerSwitcher.setOnClickListener(viewOnClickListener);
settingSwitcher.setOnClickListener(viewOnClickListener);
}

/**
* initHomeTitle background rescource
*/
private void initTitleBG() {
indexSwitcher.setBackgroundColor(getResources().getColor(
R.color.activity_mian_title));
youhusSwitcher.setBackgroundColor(getResources().getColor(
R.color.activity_mian_title));
managerSwitcher.setBackgroundColor(getResources().getColor(
R.color.activity_mian_title));
settingSwitcher.setBackgroundColor(getResources().getColor(
R.color.activity_mian_title));
}

/**
* 组件监听其
*/
private class ViewOnClickListener implements OnClickListener {
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.activity_main_index:
viewPager.setCurrentItem(0);
break;
case R.id.activity_main_youhua:
viewPager.setCurrentItem(1);
break;
case R.id.activity_main_manager:
viewPager.setCurrentItem(2);
break;
case R.id.activity_main_setting:
viewPager.setCurrentItem(3);
break;

}
}
}
}


3.建立相应的fragment实例,并加载相应的布局文件,这里只列举其中一页,其他页可相应建立

package cn.edu.gzu.BackPP.Fragment;

import cn.edu.gzu.BackPP.Dao.Const;
import cn.edu.gzu.BackPP.activities.R;
import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;

public class SettingFragment extends Fragment implements OnClickListener {

@Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);

}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.activity_main_fragment_setting,
container, false);
return view;
}
}


4.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:background="@color/app_background" >
<TextView
android:id="@+id/settinglist1_qidongTv"
style="@style/setting_textview"
android:text="@string/settinglist1"/>
<LinearLayout
android:id="@+id/setting_layout1"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun1_boottext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/list_item_downloading_dwonloading"
android:text="  开机自动启动"/>
<ImageView
android:id="@+id/setting_fun1_bootimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/switch_bg_off"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/setting_layout2"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun2_boottext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/menu_heiming_manager"
android:text="  状态栏显示图标"/>
<ImageView
android:id="@+id/setting_fun2_bootimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/switch_bg_off"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:id="@+id/settinglist2_phoneinfo"
style="@style/setting_textview"
android:text="@string/settinglist2_ponheinfo"/>
<LinearLayout
android:id="@+id/setting_layout3"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun3_phonetext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/menu_icon_addto_pressed"
android:text="  手机信息"/>
<ImageView
android:id="@+id/setting_fun3_phoneimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/setting_layout4"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun4_phonetext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/menu_innum_heiming"
android:text="  手机称号"/>
<ImageView
android:id="@+id/setting_fun4_phoneimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:id="@+id/settinglist3_password"
style="@style/setting_textview"
android:text="@string/settinglist3_password"/>
<LinearLayout
android:id="@+id/setting_layout5"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun5_passwordtext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/menu_numandsms_backup"
android:text="  密码设置"/>
<ImageView
android:id="@+id/setting_fun5_passwordimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/setting_layout6"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun6_clspasswordtext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/menu_number_location"
android:text="  清除密码"/>
<ImageView
android:id="@+id/setting_fun6_clspasswordimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/setting_layout7"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun7_questext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/quku_music_list_op_pressed"
android:text="  密保问题设置"/>
<ImageView
android:id="@+id/setting_fun7_quesimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:id="@+id/settinglist4_about"
style="@style/setting_textview"
android:text="@string/settinglist4_password"/>
<LinearLayout
android:id="@+id/setting_layout8"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun8_othertext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/scan_check_pressed"
android:text="  关于"/>
<ImageView
android:id="@+id/setting_fun8_otherimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/setting_layout9"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun9_othertext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/scan_folder_icon_pressed"
android:text="  鸣谢"/>
<ImageView
android:id="@+id/setting_fun9_otherimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/setting_layout10"
style="@style/setting_subfun_layout"
>
<TextView
android:id="@+id/setting_fun10_othertext"
style="@style/setting_subfun_maintext"
android:drawableLeft="@drawable/menu_numandsms_backup"
android:text="  意见反馈"/>
<ImageView
android:id="@+id/setting_fun10_otherimg"
android:layout_weight="0"
android:layout_width="30dip"
android:layout_height="25dip"
android:src="@drawable/enter_next"
/>
</LinearLayout>
<include layout="@layout/devide_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

</LinearLayout>


5.fragment适配器

package cn.edu.gzu.BackPP.adapter;

import java.util.ArrayList;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

public class MyFragmentAdapter extends FragmentPagerAdapter{
private ArrayList<Fragment> myFragments;

public MyFragmentAdapter(FragmentManager fm) {
super(fm);
}
public MyFragmentAdapter(FragmentManager fragmentManager,ArrayList<Fragment> myFragments) {
super(fragmentManager);
this.myFragments=myFragments;
}

@Override
public Fragment getItem(int arg0) {
return myFragments.get(arg0);
}

@Override
public int getCount() {
return myFragments.size();
}

@Override
public int getItemPosition(Object object) {
return super.getItemPosition(object);
}

}


这样就可以实现能左右滑动的主界面了,效果基本上实现如效果图所示,由于其他三页也都是差不多的布局,有时间的话,后续再贴出来

可能界面不是很漂亮,不过目的也就是为了练习,大部分图片都在网上搜的,没办法了

 

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: