当前位置: 代码迷 >> Android >> android(七) 360界面的实现
  详细解决方案

android(七) 360界面的实现

热度:52   发布时间:2016-04-28 00:48:03.0
android(7) 360界面的实现

一.360界面的实现:

    看了别人的源码从而又完善了一下,这种界面实现起来还是不麻烦的(要源码的留下邮箱,我给你们发)。

效果图:






主界面:

public class MainActivity extends Activity {	private ImageView ivOne;	private ImageView ivTwo;	private ImageView button1;	private ImageView button2;	private ImageView button3;	private ImageView button4;	/*	 * AccelerateInterpolator 在动画开始的时候速率改变比较慢,然后开始加速 BounceInterpolator	 * 动画结束的时候弹起 DecelerateInterpolator 在动画开始的时候快,然后变慢 。。。	 */	// 动画加速	private Interpolator accelerator = new AccelerateInterpolator();	// 动画减速	private Interpolator decelerator = new DecelerateInterpolator();	private ViewPager vpMain;	private List<View> views;     private View viewOne;     private View viewTwo;	@Override	protected void onCreate(Bundle savedInstanceState) {		// TODO Auto-generated method stub		super.onCreate(savedInstanceState);		setView();		initView();		setListener();	}	public void setView() {		requestWindowFeature(Window.FEATURE_NO_TITLE);		setContentView(R.layout.activity_main);	}	public void initView() {		// 页数按钮		ivOne = (ImageView) findViewById(R.id.viewpager_one);		ivTwo = (ImageView) findViewById(R.id.viewpager_two);		button1 = (ImageView) findViewById(R.id.button1);		button2 = (ImageView) findViewById(R.id.button2);		button3 = (ImageView) findViewById(R.id.button3);		button4 = (ImageView) findViewById(R.id.button4);		// ViewPager		vpMain = (ViewPager) findViewById(R.id.viewpager_main);		views = new ArrayList<View>();        viewOne = View.inflate(this, R.layout.activity_main_one, null);		views.add(viewOne);        viewTwo = View.inflate(this, R.layout.activity_mian_two, null);        		views.add(viewTwo);		MyAdapter adapter = new MyAdapter();		MyListener listener = new MyListener();		vpMain.setAdapter(adapter);		// 监听滑动		vpMain.setOnPageChangeListener(listener);				LinearLayout activity_main_one_layout = (LinearLayout)viewOne.findViewById(R.id.activity_main_one_layout);		for (int i = 0; i <  activity_main_one_layout.getChildCount(); i++) {			for(int j = 0 ;j < ((LinearLayout)activity_main_one_layout.getChildAt(i)).getChildCount() ; j++){				final int ii = i;				final int jj = j;				((LinearLayout)activity_main_one_layout.getChildAt(i)).getChildAt(j).setOnClickListener(new View.OnClickListener() {					@Override					public void onClick(View arg0) {						Toast.makeText(MainActivity.this, "第"+ii+"行,第"+jj+"个", Toast.LENGTH_SHORT).show();					}				});			}		}	}	public void setListener() {		ivOne.setOnClickListener(new ImageViewOnClickListener());		ivTwo.setOnClickListener(new ImageViewOnClickListener());				button1.setOnClickListener(new ImageViewOnClickListener());		button2.setOnClickListener(new ImageViewOnClickListener());		button3.setOnClickListener(new ImageViewOnClickListener());		button4.setOnClickListener(new ImageViewOnClickListener());	}		// 点击ImageView,两个页面的切换方法	private void flipit(View one, View two) {		final View visible;		final View invisible;		// 判断两个view那个是隐藏的,然后切换		if (one.getVisibility() == View.GONE) {			visible = two;			invisible = one;		} else {			invisible = two;			visible = one;		}		// 设置动画,以X轴旋转		ObjectAnimator visToInvis = ObjectAnimator.ofFloat(visible,				"rotationX", 0f, 90f);		// 设置时间		visToInvis.setDuration(500);		// 设置动画变化速率		visToInvis.setInterpolator(accelerator);		final ObjectAnimator invisToVis = ObjectAnimator.ofFloat(invisible,				"rotationX", -90f, 0f);		invisToVis.setDuration(500);		invisToVis.setInterpolator(decelerator);		visToInvis.addListener(new AnimatorListenerAdapter() {			@Override			public void onAnimationEnd(Animator anim) {				visible.setVisibility(View.GONE);				invisToVis.start();				invisible.setVisibility(View.VISIBLE);			}		});		visToInvis.start();	}    //适配器	class MyAdapter extends PagerAdapter {		@Override		public int getCount() {			return views.size();		}		@Override		public boolean isViewFromObject(View view, Object obj) {			return view == obj;		}		@Override		public void destroyItem(ViewGroup container, int position, Object object) {			container.removeView(views.get(position));		}		@Override		public Object instantiateItem(ViewGroup container, int position) {			container.addView(views.get(position));			return views.get(position);		}	}    //滑动监听	class MyListener implements OnPageChangeListener {		// 手指操作屏幕的时候发生变化		@Override		public void onPageScrollStateChanged(int arg0) {		}		// 在屏幕滚动过程中不断被调用		@Override		public void onPageScrolled(int arg0, float arg1, int arg2) {		}		// 手指滑动翻页的时候,滑动的距离够长,手指抬起来就会立即执行这个方法,arg0是页数		@Override		public void onPageSelected(int arg0) {			flipit(ivOne, ivTwo);		}	}    //ImageView监听	class ImageViewOnClickListener implements View.OnClickListener {		@Override		public void onClick(View arg0) {			switch (arg0.getId()) {			case R.id.button1:				Toast.makeText(MainActivity.this, "我要下载", Toast.LENGTH_SHORT)						.show();				break;			case R.id.button2:				Toast.makeText(MainActivity.this, "我要删除", Toast.LENGTH_SHORT)						.show();				break;			case R.id.button3:				Toast.makeText(MainActivity.this, "我要设置", Toast.LENGTH_SHORT)						.show();				break;			case R.id.button4:				Toast.makeText(MainActivity.this, "我要添加", Toast.LENGTH_SHORT)						.show();				break;			case R.id.viewpager_one:				flipit(ivOne, ivTwo);				//setCurrentItem选中页数,getCurrentItem返回当前页数				vpMain.setCurrentItem((vpMain.getCurrentItem() + 1) % views.size());				break;			case R.id.viewpager_two:				flipit(ivOne, ivTwo);				vpMain.setCurrentItem((vpMain.getCurrentItem() + 1) % views.size());				break;			}		}	}}

主界面布局:

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="@drawable/w6" >    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:gravity="center_vertical"        android:orientation="vertical"        android:layout_margin="10dp"        android:paddingLeft="5dp" >        <LinearLayout            android:id="@+id/title"            android:layout_width="wrap_content"            android:layout_height="60dp"            android:layout_marginBottom="10dp"            android:layout_marginLeft="15dp"            android:layout_marginTop="8dp"            android:orientation="vertical" >            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:padding="5dp"                android:text="哈哈哈哈"                android:textColor="#aaffffff"                android:textScaleX="1.2"                android:textSize="20sp" >            </TextView>            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="哈哈哈哈哈哈哈哈"                android:textColor="#88ffffff"                android:textSize="15sp" >            </TextView>        </LinearLayout>        <android.support.v4.view.ViewPager            android:id="@+id/viewpager_main"            android:layout_width="wrap_content"            android:layout_height="wrap_content"             />    </LinearLayout>    <RelativeLayout        android:layout_width="50dp"        android:layout_height="match_parent"        android:layout_alignParentRight="true"        android:paddingBottom="30dp"        android:paddingRight="5dp"        android:paddingTop="60dp" >        <include            android:id="@+id/main_sb"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            layout="@layout/activity_main_left" />        <ImageView            android:id="@+id/viewpager_one"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentBottom="true"            android:background="@drawable/rootblock_main_page_one"            />        <ImageView            android:id="@+id/viewpager_two"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_alignParentBottom="true"            android:background="@drawable/rootblock_main_page_two"            android:visibility="gone" />    </RelativeLayout></RelativeLayout>

左布局:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="vertical" >    <ImageView        android:id="@+id/button1"        android:layout_width="36dp"        android:layout_height="36dp"        android:src="@drawable/rootblock_icon_download_bg" />    <ImageView        android:id="@+id/button2"        android:layout_width="36dp"        android:layout_height="36dp"        android:layout_marginTop="20dp"        android:src="@drawable/rootblock_icon_clear_bg" />    <ImageView        android:id="@+id/button3"        android:layout_width="36dp"        android:layout_height="36dp"        android:layout_marginTop="20dp"        android:src="@drawable/rootblock_icon_set_bg" />    <ImageView        android:id="@+id/button4"        android:layout_width="36dp"        android:layout_height="36dp"        android:layout_marginTop="20dp"        android:src="@drawable/rootblock_icon_add_bg" /></LinearLayout>

第一页view:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:paddingBottom="30dp"    android:orientation="vertical"    android:id="@+id/activity_main_one_layout" >    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#000000">        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#000000" >        </LinearLayout>    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#3399ff" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#3399ff" >        </LinearLayout>    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#3399ff" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#3399ff" >        </LinearLayout>    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#953399ff" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#953399ff" >        </LinearLayout>    </LinearLayout></LinearLayout>

第二页view:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="vertical"    android:paddingBottom="30dp" >    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#FF7F24" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#FF7F24" >        </LinearLayout>    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#3399ff" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#3399ff" >        </LinearLayout>    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#3399ff" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#3399ff" >        </LinearLayout>    </LinearLayout>    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="5dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:background="#953399ff" >        </LinearLayout>        <LinearLayout            android:layout_width="110dp"            android:layout_height="80dp"            android:layout_marginLeft="5dp"            android:background="#953399ff" >        </LinearLayout>    </LinearLayout></LinearLayout>

drawable:

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item android:state_focused="true" android:drawable="@drawable/rootblock_icon_add"></item>	<item android:state_pressed="true" android:drawable="@drawable/rootblock_icon_add_selected"></item>	<item android:state_enabled="true" android:drawable="@drawable/rootblock_icon_add"></item></selector>

另外三个xml一样。




 

1楼jhgwqp昨天 10:17
[email protected]
Re: u010708662昨天 11:20
回复jhgwqpn已发送
  相关解决方案