1-1 课程介绍—功能技术点和课程安排
主要功能
主要技术点
1-3 准备工作—项目架构部署
创建相应包结构
创建相应包结构
相关类，先创建放着，后面会去实现它
创建相应类
做一些初始化，比如头文件注释，打开settings，搜索code，如图
BaseApplication（位于application）
public class BaseApplication extends Application {
//创建
@Override
public void onCreate() {
super.onCreate();
}
创建完BaseApplication后，需要在清单文件AndroidManifest.xml中生命application
<application
android:name=".application.BaseApplication"
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
....省略
</application>
BaseApplication（位于ui）
这个类是用来设置一些公共的属性。
显示返回箭头
/**
* 主要做得事情
* 1.统一的属性
* 2.统一的接口
* 3.统一的方法
*/
public class BaseActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getSupportActionBar().setElevation(0);
//显示返回键
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
//菜单栏操作
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home://android自带的id
finish();//finish（）就是直接返回了
break;
}
return super.onOptionsItemSelected(item);
}
}
drawable
如上图包结构创建相应drawable
values
如上图创建values-zh，values-en，用来做国际化
StaticClass,UtilTools
存放常量，常用工具类，现在我们创建了，先为空，以后用到再去写
1-4 首页框架—TabLayout布局搭建
TabLayout简介
演示
//在build.gradle添加tablayout依赖
compile 'com.android.support:design:24.2.0'
TabLayout属性详解:http://www.jianshu.com/p/2b2bb6be83a8
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="@+id/mTablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
app:tabGravity="fill"
app:tabIndicatorColor="@color/colorAccent"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/colorAccent"
app:tabTextColor="@android:color/white"
/>
<android.support.v4.view.ViewPager
android:id="@+id/mViewPager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:src="@drawable/icon_setting"
android:layout_marginRight="15dp"
android:layout_marginBottom="15dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:id="@+id/fab_setting"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RelativeLayout>
一共四个fragment，我们这里就不贴代码了，直接放到github吧，刚开始只有一个textview作为测试，这里代码，我直接贴后面需要的控件，大家可以直接写个textview放着先。
ButlerFragment
//导包import android.support.v4.app.Fragment;可以向下兼容
public class ButlerFragment extends Fragment implements View.OnClickListener {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_butler, null);
findView(view);
return view;
}
}
GirlFragement，UserFragement，WecharFragement这其他三个Fragment也都是如此，创建好这样放着。
MainActivity.java
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
//TabLayout
private TabLayout mTabLayout;
//ViewPager
private ViewPager mViewPager;
//Title
private List<String> mTitle;
//Fragment 一样也是V4包
private List<Fragment> mFragment;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//去掉阴影
getSupportActionBar().setElevation(0);
initData();
initView();
}
//初始化数据
private void initData() {
mTitle = new ArrayList<>();
mTitle.add(getString(R.string.text_butler_service));
mTitle.add(getString(R.string.text_wechat));
mTitle.add(getString(R.string.text_girl));
mTitle.add(getString(R.string.text_user_info));
mFragment = new ArrayList<>();
mFragment.add(new ButlerFragment());
mFragment.add(new WechatFragment());
mFragment.add(new GirlFragment());
mFragment.add(new UserFragment());
}
//初始化View
private void initView() {
mTabLayout = (TabLayout) findViewById(R.id.mTabLayout);
mViewPager = (ViewPager) findViewById(R.id.mViewPager);
//预加载
mViewPager.setOffscreenPageLimit(mFragment.size());
//设置适配器
mViewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
//选中的item
@Override
public Fragment getItem(int position) {
return mFragment.get(position);
}
//返回item的个数
@Override
public int getCount() {
return mFragment.size();
}
//设置标题
@Override
public CharSequence getPageTitle(int position) {
return mTitle.get(position);
}
});
//绑定
mTabLayout.setupWithViewPager(mViewPager);
}
我们绑定好了就可以运行了
运行效果图
1-5 首页框架—TabLayout逻辑实现
我们现在要实现悬浮按钮的逻辑
第一页不显示悬浮按钮
其他页面显示悬浮按钮
在上面activity_main.xml中已经加入了FloatingActionButton，所以我们直接来看逻辑的实现。
在MainActivity.java的initView方法中加入如下代码
fab_setting = (FloatingActionButton) findViewById(R.id.fab_setting);
fab_setting.setOnClickListener(this);
fab_setting.setVisibility(View.GONE);//按钮默认是隐藏的
在第一个页面不显示按钮，其他页面显示，在initView加入
//mViewPager滑动监听
mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
Log.i("TAG", "position:" + position);
if (position == 0) {
fab_setting.setVisibility(View.GONE);
} else {
fab_setting.setVisibility(View.VISIBLE);
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
当我们点击这个悬浮按钮就会进入到设置页面
设置页面
这是我们的点击事件的监听
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.fab_setting:
startActivity(new Intent(this, SettingActivity.class));
break;
}
}
SettingActivity.java现在也是空实现
public class SettingActivity extends BaseActivity{
@Override
public void onCreate(Bundle savedInstanceState, PersistableBundle persistentState) {
super.onCreate(savedInstanceState, persistentState);
setContentView(R.layout.activity_setting);
}
}
记得SettingActivity是一个Activity，要在AndroidManifest.xml中声明
<!--设置-->
<activity
android:name=".ui.SettingActivity"
android:label="@string/text_setting" />
到此已经完成了框架的搭建~
