透明UI设计

之前学习java和android时,在app市场,找到一个不错的学习软件Java学习手册、Android学习手册,挺喜欢它的那个透明的UI设计

现仿照它自己做了一个,加深自己的功力。



这个App一共用到以下几种功能:
1.GridView 九宫格(显示item)
2.ViewPage+Fragment(经典的滑动切换菜单)
3.ObjectAnimator 动画(控制page图标切换)
4.TranslateAnimation 横移动画(控制主layout的移动)
5.DrawerLayout  v4包自带抽屉功能(即侧滑菜单,但主layout不会移动),配合上面的TranslateAnimation实现主+副一起移动


主Activity代码:

package com.example.xin_test_alphaviewpage;

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.ObjectAnimator;
import android.opengl.Visibility;
import android.os.Bundle;
import android.support.v4.app.ActionBarDrawerToggle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.support.v4.widget.DrawerLayout.DrawerListener;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.TranslateAnimation;
import android.view.Display;
import android.view.Gravity;
import android.view.MenuItem;
import android.view.Window;
import android.view.WindowManager;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;

public class MainActivity extends FragmentActivity {

	private ViewPager mViewPager;// 多页面划动视图
	private ViewPagerAdapter mViewPagerAdapter;// 设置自定义ViewPager的适配器

	private Fragment1 mFragment2 = new Fragment1();
	private Fragment2 mFragment3 = new Fragment2();

	private ImageView iv_main_page;
	ObjectAnimator anim,anim1;
	private ImageButton btn_arrow;
	private boolean isClickArrow = false;
	private boolean isOpen = false;
	private DrawerLayout mDrawerLayout;// 总布局
	private RelativeLayout relLay_menu;// 主布局
	private LinearLayout linLay_menu;// 分布局

	private ActionBarDrawerToggle mDrawerToggle;

	private int x = 0;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);// 设置全屏
		requestWindowFeature(Window.FEATURE_NO_TITLE);// 去除标题栏
		setContentView(R.layout.activity_main);
		setUpViewPager();
		// 三个布局对象
		mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLay);
		relLay_menu = (RelativeLayout) findViewById(R.id.relLay_menu);
		linLay_menu = (LinearLayout) findViewById(R.id.linLay_menu);

		//mDrawerToggle抽栖用来控制开关的对象,参数固定,暂不知道有啥用,照写就是
		mDrawerToggle = new ActionBarDrawerToggle(this, /* host Activity */
		mDrawerLayout, /* DrawerLayout object */
		R.drawable.ic_launcher, /* nav drawer image to replace 'Up' caret */
		R.string.drawer_open, /* "open drawer" description for accessibility */
		R.string.drawer_close /* "close drawer" description for accessibility */
		) {
			@Override
			public void onDrawerStateChanged(int newState) {
				super.onDrawerStateChanged(newState);
				System.out.println("Changed="+newState);
				if(newState==2){					
					if(!isOpen){
						isOpen = true;
						TranslateAnimation animation = new TranslateAnimation(x,
								-linLay_menu.getWidth(), 0, 0);
						animation.setDuration(500);
						animation.setFillAfter(true);
						relLay_menu.startAnimation(animation);
						x = -linLay_menu.getWidth();
					}else {
						isOpen = false;
						isClickArrow = false;
						btn_arrow.setImageResource(R.drawable.menu_left);
						TranslateAnimation animation = new TranslateAnimation(x,
								0, 0, 0);
						animation.setDuration(100);
						animation.setFillAfter(true);
						relLay_menu.startAnimation(animation);
						x = 0;
					}
				}
			}	
		};
		mDrawerLayout.setDrawerListener(mDrawerToggle);
		
		
        final Display display = getWindowManager().getDefaultDisplay();

		iv_main_page = (ImageView) findViewById(R.id.iv_main_page);
		//启动两个动画的用意:使page图标转动起来更好看,不用转完再换图片,不美观
		anim = ObjectAnimator.ofFloat(iv_main_page, "rotationY", 0f, 90f);
		anim1 = ObjectAnimator.ofFloat(iv_main_page, "rotationY", 90f, 360f);
		btn_arrow = (ImageButton) findViewById(R.id.btn_arrow);
		btn_arrow.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				if (!isClickArrow) {
					System.out.println("false");
					btn_arrow.setImageResource(R.drawable.menu_right);
					isClickArrow = true;
					mDrawerLayout.openDrawer(linLay_menu);			
					
				}
			}
		});
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		System.out.println("aaaaaaaaa");
		return super.onOptionsItemSelected(item);
	}

//	private DrawerListener mDrawerListener = new DrawerListener() {
//
//		@Override
//		public void onDrawerClosed(View arg0) {
//			System.out.println("1111111111111");
//			invalidateOptionsMenu();
//		}
//
//		@Override
//		public void onDrawerOpened(View arg0) {
//			System.out.println("2222222222");
//			invalidateOptionsMenu();
//
//		}
//
//		@Override
//		public void onDrawerSlide(View arg0, float arg1) {
//			System.out.println("33333333333333");
//			invalidateOptionsMenu();
//
//		}
//
//		@Override
//		public void onDrawerStateChanged(int arg0) {
//			System.out.println("44444444444444");
//			invalidateOptionsMenu();
//
//		}
//	};

	private void setUpViewPager() {
		// 创建FragmentPagerAdapter对象,通过内部类
		mViewPagerAdapter = new ViewPagerAdapter(getSupportFragmentManager());
		mViewPager = (ViewPager) findViewById(R.id.pager);

		mViewPager.setAdapter(mViewPagerAdapter);// 绑定适配器

		mViewPager// 对ViewPager设置监听器,监听划动到哪一个Fragment时,哪一个图标就高亮显示,否则暗色
				.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
					@Override
					public void onPageSelected(int position) {
						if (position == 0) {
							anim.setDuration(500).start();

							anim1.addListener(new AnimatorListenerAdapter() {
								public void onAnimationStart(Animator animation) {
									iv_main_page
									.setImageResource(R.drawable.main_page_one);
								};

							});
							anim1.setDuration(1000).start();
						
							

						} else if (position == 1){

							anim.setDuration(500).start();
							anim1.addListener(new AnimatorListenerAdapter() {
								public void onAnimationStart(Animator animation) {
									iv_main_page
									.setImageResource(R.drawable.main_page_two);
								};

							});
							anim1.setDuration(1000).start();					

						}
					}			
				});
	}

	// 自定义adapter
	public class ViewPagerAdapter extends FragmentPagerAdapter {

		public ViewPagerAdapter(FragmentManager fm) {
			super(fm);
		}

		@Override
		public Fragment getItem(int position) {
			switch (position) {
			case 0:
				return mFragment2;
			case 1:
				return mFragment3;
			}
			throw new IllegalStateException("No fragment at position "
					+ position);
		}

		@Override
		public int getCount() {
			return 2;
		}
	}

}



源码请去本人CSDN资源页面下载,地址:http://download.csdn.net/detail/bilichen006/9379535

作者:天龙
时间:2015.12.26
本APP中很多图片都取自网络,谢谢大家!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值