package com.loaderman.uiframedemo;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.Display;
import android.view.View;
import android.view.WindowManager;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.TextView; public class MainActivity extends AppCompatActivity { private ViewPager mTabPager;
private ImageView mTabImg;// 动画图片
private TextView mTab1, mTab2, mTab3, mTab4;
private int zero = 0;// 动画图片偏移量
private int currIndex = 0;// 当前页卡编号
private int one;//单个水平动画位移
private int two;
private int three; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);
setContentView(R.layout.activity_main);
mTabPager = (ViewPager) findViewById(R.id.tabpager);
mTabPager.addOnPageChangeListener(new MyOnPageChangeListener());
mTab1 = (TextView) findViewById(R.id.tv_weixin);
mTab2 = (TextView) findViewById(R.id.tv_address);
mTab3 = (TextView) findViewById(R.id.tv_friends);
mTab4 = (TextView) findViewById(R.id.tv_settings);
mTabImg = (ImageView) findViewById(R.id.img_tab_now);
mTab1.setOnClickListener(new MyOnClickListener(0));
mTab2.setOnClickListener(new MyOnClickListener(1));
mTab3.setOnClickListener(new MyOnClickListener(2));
mTab4.setOnClickListener(new MyOnClickListener(3));
Display currDisplay = getWindowManager().getDefaultDisplay();//获取屏幕当前分辨率
int displayWidth = currDisplay.getWidth();
// int displayHeight = currDisplay.getHeight();
one = displayWidth / 4; //设置水平动画平移大小
two = one * 2;
three = one * 3;
mTabPager.setAdapter(new MyAdapter(getSupportFragmentManager()));
}
/**
* 1、ViewPager展示的是一个又一个普通的View对象,使用PagerAdapter
* 2、ViewPager展示的是一个又一个Fragment所包装的View对象,使用FragmentPagerAdapter
*/
class MyAdapter extends FragmentPagerAdapter {
private String[] mTabNames;
public MyAdapter(FragmentManager fm) {
super(fm);
mTabNames = new String[]{"weixin", "adreess", "friend", "settring",};
}
@Override
public Fragment getItem(int position) {
return FragmentFactory.getFragment(position);
}
@Override
public int getCount() {
return mTabNames.length;
} }
/**
* 头标点击监听
*/
public class MyOnClickListener implements View.OnClickListener {
private int index = 0; public MyOnClickListener(int i) {
index = i;
}
@Override
public void onClick(View v) {
mTabPager.setCurrentItem(index);
}
};
/* 页卡切换监听
*/
public class MyOnPageChangeListener implements ViewPager.OnPageChangeListener {
@Override
public void onPageSelected(int arg0) {
Animation animation = null;
switch (arg0) {
case 0:
if (currIndex == 1) {
animation = new TranslateAnimation(one, 0, 0, 0);
} else if (currIndex == 2) {
animation = new TranslateAnimation(two, 0, 0, 0);
} else if (currIndex == 3) {
animation = new TranslateAnimation(three, 0, 0, 0);
}
break;
case 1:
if (currIndex == 0) {
animation = new TranslateAnimation(zero, one, 0, 0);
} else if (currIndex == 2) {
animation = new TranslateAnimation(two, one, 0, 0);
} else if (currIndex == 3) {
animation = new TranslateAnimation(three, one, 0, 0);
}
break;
case 2:
if (currIndex == 0) {
animation = new TranslateAnimation(zero, two, 0, 0);
} else if (currIndex == 1) {
animation = new TranslateAnimation(one, two, 0, 0);
} else if (currIndex == 3) {
animation = new TranslateAnimation(three, two, 0, 0);
}
break;
case 3:
if (currIndex == 0) {
animation = new TranslateAnimation(zero, three, 0, 0);
} else if (currIndex == 1) {
animation = new TranslateAnimation(one, three, 0, 0);
} else if (currIndex == 2) {
animation = new TranslateAnimation(two, three, 0, 0);
}
break;
}
currIndex = arg0;
animation.setFillAfter(true);// True:图片停在动画结束位置
animation.setDuration(150);
mTabImg.startAnimation(animation);
} @Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
} @Override
public void onPageScrollStateChanged(int arg0) {
}
}
}
package com.loaderman.uiframedemo;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup; public abstract class BaseFragment extends Fragment {
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
return initView();
}
public abstract View initView() ;
}
package com.loaderman.uiframedemo;

import android.support.v4.app.Fragment;
import java.util.HashMap; public class FragmentFactory {
private static HashMap<Integer, Fragment> savedFragment = new HashMap<Integer, Fragment>();
public static Fragment getFragment(int position) {
Fragment fragment = savedFragment.get(position);
if (fragment == null) {
switch (position) {
case 0:
fragment = new WenxinFragment();
break;
case 1:
fragment = new AddressFragment();
break;
case 2:
fragment = new FriendFragment();
break;
case 3:
fragment = new SettingFragment();
break;
}
savedFragment.put(position, fragment);
}
return fragment;
}
}

WenxinFragment,AddressFeament,FriendFragment,SettingFragment的实现类似如下:

package com.loaderman.uiframedemo;

import android.view.View;
import android.widget.TextView; public class SettingFragment extends BaseFragment {
@Override
public View initView() {
TextView tv = new TextView(getContext());
tv.setText("设置");
return tv;
}
}

效果图:

利用Viewpager和Fragment实现UI框架的搭建实现的更多相关文章

  1. 【Android 界面效果27】利用ViewPager、Fragment、PagerTabStrip实现多页面滑动效果

    本文主要介绍如何利用ViewPager.Fragment.PagerTabStrip实现多页面滑动效果.即google play首页.新浪微博消息(at.评论.私信.广播)页面的效果.ViewPage ...

  2. Android 利用ViewPager、Fragment、PagerTabStrip实现多页面滑动效果

    本文主要介绍如何利用ViewPager.Fragment.PagerTabStrip实现多页面滑动效果.即google play首页.新浪微博消息(at.评论.私信.广播)页面的效果.ViewPage ...

  3. iOS之UI--主流框架的搭建--仿制QQ的UI框架

    使用XCode搭建多个控制器界面,一般在实际开发中建议超过四个控制器界面使用纯代码. 下面的实例其实已经超过了四个,总结详细步骤的目的,主要是更熟悉XCode的StoryBoard使用细节. 先直接上 ...

  4. 【干货】利用MVC5+EF6搭建博客系统(四)(上)前后台页面布局页面实现,介绍使用的UI框架以及JS组件

    一.博客系统进度回顾以及页面设计 1.1页面设计说明 紧接前面基础基本完成了框架搭建,现在开始设计页面,前台页面设计我是模仿我博客园的风格来设计的,后台是常规的左右布局风格. 1.2前台页面风格 主页 ...

  5. ViewPager之Fragment页面切换

    一.概述 ViewPager是android-support-v4中提供的类,它是一个容器类,常用于页面之间的切换. 继上篇文章<ViewPager之引导页>之后,本文主要介绍ViewPa ...

  6. 前端UI框架和JS类库

    一.前端框架库: 1.Zepto.js 地址:http://www.css88.com/doc/zeptojs/ 描述:Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jqu ...

  7. Unity3D 搭建优雅的UI框架

    为什么要使用UI框架?直接使用NGUI或UGUI一拖一拉直接搭载出界面不就行了? 我相信很多小白,包括我在刚学习Unity3D UI的时候都这样想过. 我的第一款款Unity2D游戏<山地赛车& ...

  8. Android酷炫实用的开源框架(UI框架)

    Android酷炫实用的开源框架(UI框架) 前言 忙碌的工作终于可以停息一段时间了,最近突然有一个想法,就是自己写一个app,所以找了一些合适开源控件,这样更加省时,再此分享给大家,希望能对大家有帮 ...

  9. Android酷炫实用的开源框架——UI框架(转)

    转载别人整理好的文章,列出了很多炫酷的UI开源设计 原文地址:http://www.androidchina.net/1992.html 1.Side-Menu.Android分类侧滑菜单,Yalan ...

随机推荐

  1. centos 7 安装 LNMPC cacti 1.2.7 监控

    先上图,后续更新

  2. nohup命令(Linux终端启动后台运行程序)

    1. nohup指令基本概念: nohup: 不挂断的运行,并没有后台运行功能,用nohup运行命令可以使命令永久执行下去,和用户终端没有关系,断开SSH不影响运行,&是后台运行. nohup ...

  3. 日常系统维护之修复linux的grub引导

    恩,不知道怎么表达为win10的更新很烦人,其实我感觉windows用的不是那么顺手,但是制作视频的时候还是要用到,图片的话linux也可以胜任,毕竟GUN IMAGE还是挺不错的,但到了视频制作方面 ...

  4. JVM锁说明

          以前Synchronised关键字加锁效率问题,经常受到吐槽.后来java的开发团队进行了优化,引入了偏向锁.自旋锁.轻量锁,性能有了很大的提升.下面我们来分析下这里面的过程和原理.   ...

  5. 关于HTML5视频标签的问题

    一.基本 video标签在兼容性上还是比较差的,如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8的(Opera.Mozilla.Chrome),支持H.264的( ...

  6. 如何判断元素是否在可视区域ViewPort

    个性签名: 生如夏花,逝如冬雪:人生如此,何悔何怨. 前言: 经常需要计算元素的大小或者所在页面的位置,offsetWidth,clientWidth,scrollWidth,scrollTop这几个 ...

  7. Python3之Django框架搭建详细步骤

    安装Django 自行下载的pip,可执行如下命令: pip install django 下载python3版本可以自带pip3 ,命令如下: pip3 install django 此命令会下载d ...

  8. BZOJ 2882: 工艺 (SA/SAM/最小表示法)

    我写的O(nlogn)O(nlogn)O(nlogn)的SA 8000ms 被 O(n)O(n)O(n)的SAM 2800ms 和 O(n)O(n)O(n)的最小表示法 500ms 头都锤爆- COD ...

  9. CodeForces 788B - Weird journey [ 分类讨论 ] [ 欧拉通路 ]

    题意: 给出无向图. good way : 仅有两条边只经过一次,余下边全经过两次的路 问你共有多少条不同的good way. 两条good way不同仅当它们所经过的边的集合中至少有一条不同 (很关 ...

  10. git 版本撤销,回退等

    git checkout -- <file>       #丢弃工作区的修改, 不要省略 -- ,这是只在工作区(work tree)修改了内容,还没有add 到暂存区,此时想撤销修改. ...