源码暂时不会给，因为此应用博主是要制作出来上线的，而且现在只做了一部分
效果图：
思路：
1.程序由一个Activity和多个Fragment组成
2.程序第一次进入时先进入引导界面，然后进入主界面。以后每次都是先进入欢迎界面,然后进入主界面
3.引导界面由ViewPager构成，在最后一个page上设置一个开始使用按钮，点击按钮就能进入主页面
4.主页面三页分栏，包括主页，消息和我的。禁用滑动
5.“主页”里面是天气的信息，主体结构是一个ViewPager,如果添加了城市，就可以滑动看添加城市的天气情况。
6.“我的“里面包括登陆，注册，以及一些常用的设置
三页分栏的实现：
1.bottom_tab.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/tab_bg"
>
<LinearLayout
android:id="@+id/lin0"
android:orientation="vertical"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center">
<ImageView
android:id="@+id/weather_tab"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@mipmap/tab_pressed_1"/>
<TextView
android:id="@+id/weather_tab_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/tab_text_color"
android:text="@string/weather_tab_text"
/>
</LinearLayout>
<LinearLayout
android:id="@+id/lin2"
android:orientation="vertical"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center">
<ImageView
android:id="@+id/message_tab"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@mipmap/tab_normal_3"/>
<TextView
android:id="@+id/message_tab_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/tab_text_color"
android:text="@string/message_tab_text"/>
</LinearLayout>
<LinearLayout
android:id="@+id/lin3"
android:orientation="vertical"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center">
<ImageView
android:id="@+id/my_tab"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@mipmap/tab_normal_4"/>
<TextView
android:id="@+id/my_tab_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/my_tab_text"
android:textColor="@color/tab_text_color"
/>
</LinearLayout>
</LinearLayout> 2.点击效果的实现
public class MainFragment extends Fragment implements View.OnClickListener{
private View mainView;
//viewPager
private TabViewPager tabViewPager;
//底部tab
private View layoutView;
private ImageView tab_weather,tab_city,tab_message,tab_my;
private TextView tab_weather_text,tab_city_text,tab_message_text,tab_my_text;
//tabViewPager的适配器
private TabPagerAdapter adapter;
private FragmentManager manager;
//数据
private ArrayList<Fragment> fragList=new ArrayList<>();
private WeatherFragment weatherFragment;
private CityFragment cityFragment;
private MessageFragment messageFragment;
private MyFragment myFragment;
private LinearLayout lin1,lin2,lin3,lin0;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
mainView=inflater.inflate(R.layout.fragment_main,container,false);
if (fragList.size()==0){
}
else{
fragList.clear();
Log.i("info2","不为0"+fragList.size());
}
initView();
getData();
setAdatper();
setOnListener();
return mainView;
}
@Override
public void onResume() {
super.onResume();
}
/**
* 初始化控件
*/
public void initView(){
tabViewPager= (TabViewPager) mainView.findViewById(R.id.tab_viewPager);
layoutView=mainView.findViewById(R.id.bottom_tab);
tab_weather= (ImageView) layoutView.findViewById(R.id.weather_tab);
tab_weather_text= (TextView) layoutView.findViewById(R.id.weather_tab_text);
tab_message= (ImageView) layoutView.findViewById(R.id.message_tab);
tab_message_text= (TextView) layoutView.findViewById(R.id.message_tab_text);
tab_my= (ImageView) layoutView.findViewById(R.id.my_tab);
tab_my_text= (TextView) layoutView.findViewById(R.id.my_tab_text);
lin0= (LinearLayout) layoutView.findViewById(R.id.lin0);
lin2= (LinearLayout) layoutView.findViewById(R.id.lin2);
lin3= (LinearLayout) layoutView.findViewById(R.id.lin3);
}
/**
* 为tabViewPager设置适配器
*/
public void setAdatper(){
tabViewPager.setOffscreenPageLimit(fragList.size()-1);
manager=getActivity().getSupportFragmentManager();
adapter=new TabPagerAdapter(manager,fragList);
tabViewPager.setAdapter(adapter);
}
/**
* 获得数据
*/
public void getData(){
weatherFragment = new WeatherFragment();
messageFragment=new MessageFragment();
myFragment=new MyFragment();
fragList.add(weatherFragment);
fragList.add(messageFragment);
fragList.add(myFragment);
}
/**
* 设置监听
*/
public void setOnListener() {
lin0.setOnClickListener(this);
lin2.setOnClickListener(this);
lin3.setOnClickListener(this);
//为tabViewPager设置监听
tabViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
resetView();
switch (position) {
case 0:
tab_weather.setImageResource(R.mipmap.tab_pressed_1);
tab_weather_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
break;
case 1:
tab_city.setImageResource(R.mipmap.tab_pressed_2);
tab_city_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
break;
case 2:
tab_message.setImageResource(R.mipmap.tab_pressed_3);
tab_message_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
break;
case 3:
tab_my.setImageResource(R.mipmap.tab_pressed_4);
tab_my_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
break;
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
/**
* 按钮的点击事件监听
* @param v
*/
@Override
public void onClick(View v) {
resetView();
switch (v.getId()){
case R.id.lin0:
tab_weather.setImageResource(R.mipmap.tab_pressed_1);
tab_weather_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
tabViewPager.setCurrentItem(0);
break;
// case R.id.lin1:
// tab_city.setImageResource(R.mipmap.tab_pressed_2);
// tab_city_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
// tabViewPager.setCurrentItem(1);
// break;
case R.id.lin2:
tab_message.setImageResource(R.mipmap.tab_pressed_3);
tab_message_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
tabViewPager.setCurrentItem(2);
break;
case R.id.lin3 :
tab_my.setImageResource(R.mipmap.tab_pressed_4);
tab_my_text.setTextColor(ContextCompat.getColor(getContext(), R.color.tab_text_color_pressed));
tabViewPager.setCurrentItem(3);
break;
}
}
/**
* 每次滑动viewPager前 重置view
*/
public void resetView(){
tab_weather.setImageResource(R.mipmap.tab_normal_1);
// tab_city.setImageResource(R.mipmap.tab_normal_2);
tab_message.setImageResource(R.mipmap.tab_normal_3);
tab_my.setImageResource(R.mipmap.tab_normal_4);
// tab_weather_text.setTextColor(getResources().getColor(R.color.tab_text_color)); 6.0 方法弃用
tab_weather_text.setTextColor(ContextCompat.getColor(getContext(),R.color.tab_text_color));
// tab_city_text.setTextColor(ContextCompat.getColor(getContext(),R.color.tab_text_color));
tab_message_text.setTextColor(ContextCompat.getColor(getContext(),R.color.tab_text_color));
tab_my_text.setTextColor(ContextCompat.getColor(getContext(),R.color.tab_text_color));
}