码迷,mamicode.com
首页 > 移动开发 > 详细

Android 常用布局视图

时间:2015-12-04 20:20:20      阅读:190      评论:0      收藏:0      [点我收藏+]

标签:

# ScrollView 滚动视图
<ScrollView
	android:layout_width="wrap_content"
	android:layout_height="wrap_content">
	<HorizontalScrollView
		android:layout_width="wrap_content"
		android:layout_height="wrap_content">
		<Button
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:width="10000dp"
			android:height="10000dp"
			/>
	</HorizontalScrollView>
</ScrollView>

# TabHost
	1. 静态
	主XML:
		<TabHost
			android:id="@+id/tabhost"
			android:layout_width="match_parent"
			android:layout_height="wrap_content">
			<LinearLayout
				android:layout_width="match_parent"
				android:layout_height="match_parent"
				android:orientation="vertical" >
				<TabWidget
					android:id="@android:id/tabs"
					android:layout_width="match_parent"
					android:layout_height="wrap_content" >
				</TabWidget>
				<FrameLayout
					android:id="@android:id/tabcontent"
					android:layout_width="match_parent"
					android:layout_height="match_parent" >
					<LinearLayout
						android:id="@+id/tab1"
						android:layout_width="match_parent"
						android:layout_height="match_parent" >
						<TextView
							android:id="@+id/textView1"
							android:layout_width="wrap_content"
							android:layout_height="wrap_content"
							android:text="林炳东" />
					</LinearLayout>
				</FrameLayout>
			</LinearLayout>
		</TabHost>
	TAB XML: xxx.xml
		<?xml version="1.0" encoding="utf-8"?>
		<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
			android:orientation="vertical" android:layout_width="match_parent"
			android:layout_height="match_parent"
			android:id="@+id/xxx">
			<Button
				style="?android:attr/buttonStyleSmall"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:text="New Button"
				android:id="@+id/button"
				android:layout_gravity="center_horizontal" />
		</LinearLayout>
	JAVA:
		TabHost th=(TabHost)findViewById(R.id.tabhost);
        th.setup();
        LayoutInflater i= LayoutInflater.from(this);
        i.inflate(R.layout.xxx, th.getTabContentView());
        th.addTab(th.newTabSpec("tab1")
                .setIndicator("标签1", null)
                .setContent(R.id.tab1));
        th.addTab(th.newTabSpec("tab2")
                .setIndicator("标签2", null)
                .setContent(R.id.xxx));
	动态内容:
		TabHost th=(TabHost)findViewById(R.id.tabHost);
        th.setup();
        TabHost.TabSpec tabSpec = th.newTabSpec("tab1")
                .setIndicator("标签1", null)
                .setContent(new TabHost.TabContentFactory() {
                    @Override
                    public View createTabContent(String tag) {
                        TextView text = new TextView(tabactivity.this);
                        text.setText("text1");
                        return text;
                    }
                });
        th.addTab(tabSpec);
        tabSpec = th.newTabSpec("tab2")
                .setIndicator("标签2", null)
                .setContent(new TabHost.TabContentFactory() {
                    @Override
                    public View createTabContent(String tag) {
                        TextView text = new TextView(tabactivity.this);
                        text.setText("text2");
                        return text;
                    }
                });
        th.addTab(tabSpec);
		

# ViewStub 延时加载视图
	<ViewStub
        android:id="@+id/rload"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout="@layout/xxx"
        />
	
	ViewStub vs = (ViewStub) findViewById(R.id.rload);
    vs.inflate();
	
# ImageSwitcher [类似 ViewSwitcher TextSwitcher]
	XML:
		<ImageSwitcher
            android:id="@+id/imageSwitcher"
            android:layout_marginTop="5dp"
            android:layout_gravity="center"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"   >
        </ImageSwitcher>
        <Button
            android:id="@+id/change"
            android:text="change"
            android:layout_marginLeft="30dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            ></Button>
	JAVA:
		private Integer[] mImageIds = { R.drawable.a1, R.drawable.a2, R.drawable.a3, R.drawable.a4};
		private  int i=0;
		private float offp=0;
		@Override
		protected void onCreate(Bundle savedInstanceState) {
			super.onCreate(savedInstanceState);
			setContentView(R.layout.tab);

			final ImageSwitcher img = (ImageSwitcher) findViewById(R.id.imageSwitcher);
			//显示VIEW
			img.setFactory(new ViewSwitcher.ViewFactory() {
				@Override
				public View makeView() {
					ImageView i = new ImageView(tabactivity.this);
					i.setBackgroundColor(0xFF000000);
					i.setScaleType(ImageView.ScaleType.FIT_CENTER);
					i.setLayoutParams(new ImageSwitcher.LayoutParams(
							ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
					return i;
				}
			});
			img.setImageDrawable(getDrawable(mImageIds[2]));
			img.setOnTouchListener(new View.OnTouchListener() {
				@Override
				public boolean onTouch(View v, MotionEvent event) {
					//getRawX()和getRawY()获得的是相对屏幕的位置
					//getX()和getY()获得的永远是相对view的触摸位置坐标
					//返回 false 将不会触发其他事件
					Log.i("MontionEvent",String.valueOf(event.getAction()));
					switch (event.getAction()) {
						case MotionEvent.ACTION_DOWN:
							offp = event.getX();
							break;
						case MotionEvent.ACTION_MOVE:
						 //   img.setLeft(-(int)(offp - event.getX()));
							break;
						case MotionEvent.ACTION_UP:
							if (offp - event.getX() > 10) {
								i--;
								img.setInAnimation(AnimationUtils
										.loadAnimation(tabactivity.this,
												R.anim.slide_in_right));
								img.setOutAnimation(AnimationUtils
										.loadAnimation(tabactivity.this,
												R.anim.slide_out_left));
							} else if (offp - event.getX() < 10) {
								i++;
								img.setInAnimation(AnimationUtils.loadAnimation(tabactivity.this,
										android.R.anim.slide_in_left));
								img.setOutAnimation(AnimationUtils.loadAnimation(tabactivity.this,
										android.R.anim.slide_out_right));
							}else
								return true;
							if (i < 0) i = mImageIds.length;
							img.setImageDrawable(getDrawable(mImageIds[i % mImageIds.length]));
							break;
					}

					return true;
				}
			});
			Button but = (Button) findViewById(R.id.change);
			but.setOnClickListener(new View.OnClickListener() {
				@Override
				public void onClick(View v) {
					i++;
					img.setInAnimation(AnimationUtils.loadAnimation(tabactivity.this,
							android.R.anim.slide_in_left));
					img.setOutAnimation(AnimationUtils.loadAnimation(tabactivity.this,
							android.R.anim.slide_out_right));
					img.setImageDrawable(getDrawable(mImageIds[i % mImageIds.length]));
				}
			});
		}
		
# ViewFlipper 带自动播放的 ViewSwitcher
	XML :
		 <ViewFlipper
			android:layout_width="match_parent"
			android:layout_height="100dp"
			android:id="@+id/filp">
			<!-- 第一个页面 -->
			<LinearLayout android:layout_width="fill_parent"
				android:layout_height="fill_parent" android:gravity="center">
				<ImageView android:layout_width="wrap_content"
					android:layout_height="wrap_content" android:src="@drawable/a1" />
			</LinearLayout>
			<!-- 第二个页面 -->
			<LinearLayout android:layout_width="fill_parent"
				android:layout_height="fill_parent" android:gravity="center">
				<ImageView android:layout_width="wrap_content"
					android:layout_height="wrap_content" android:src="@drawable/a2"
					android:gravity="center" />
			</LinearLayout>
			<!-- 第三个页面 -->
			<LinearLayout android:layout_width="fill_parent"
				android:layout_height="fill_parent" android:gravity="center">

				<ImageView android:layout_width="wrap_content"
					android:layout_height="wrap_content" android:src="@drawable/a3"
					android:gravity="center" />
			</LinearLayout>
			<!-- 第四个页面 -->
			<LinearLayout android:layout_width="fill_parent"
				android:layout_height="fill_parent" android:gravity="center">
				<ImageView android:layout_width="wrap_content"
					android:layout_height="wrap_content" android:src="@drawable/a4"
					android:gravity="center" />
			</LinearLayout>
		</ViewFlipper>
		<Button
			android:id="@+id/fc"
			android:text="change"
			android:layout_marginLeft="30dp"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			></Button>
	JAVA:
		final ViewFlipper viewFlipper = (ViewFlipper) findViewById(R.id.filp);
        viewFlipper.setInAnimation(AnimationUtils.loadAnimation(tabactivity.this,
                android.R.anim.slide_in_left));
        viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(tabactivity.this,
                android.R.anim.slide_out_right));
        Button fc = (Button) findViewById(R.id.fc);
        fc.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(viewFlipper.isFlipping())
                    viewFlipper.stopFlipping();
                else
                    viewFlipper.startFlipping();
            }
        });
        viewFlipper.startFlipping();
		
		
# ViewPager 左右滚动页面
	XML:
		<android.support.v4.view.ViewPager
			android:layout_width="match_parent"
			android:layout_height="1000dp"
			android:id="@+id/viewpager">
			<!-- PagerTabStrip 标题底部线 -->
			<android.support.v4.view.PagerTabStrip
				android:id="@+id/tabstrip"
				android:layout_width="wrap_content"
				android:layout_height="50dip"
				android:gravity="center" />
		</android.support.v4.view.ViewPager>
	JAVA:
		ViewPager pager = null;
		PagerTabStrip tabStrip = null;
		ArrayList<View> viewContainter = new ArrayList<View>();
		ArrayList<String> titleContainer = new ArrayList<String>();
		public String TAG = "tag";
		@Override
		protected void onCreate(Bundle savedInstanceState) {
			super.onCreate(savedInstanceState);
			setContentView(R.layout.tab);
			pager = (ViewPager) this.findViewById(R.id.viewpager);
			tabStrip = (PagerTabStrip) this.findViewById(R.id.tabstrip);
			//取消tab下面的长横线
			//tabStrip.setDrawFullUnderline(false);
			//设置当前tab页签的下划线颜色
			tabStrip.setTabIndicatorColor(this.getResources().getColor(android.R.color.holo_blue_bright));
			tabStrip.setTextSpacing(200);

			View view1 = LayoutInflater.from(this).inflate(R.layout.xxx, null);
			View view2 = LayoutInflater.from(this).inflate(R.layout.xxx, null);

			//viewpager开始添加view
			viewContainter.add(view1);
			viewContainter.add(view2);

			//页签项
			titleContainer.add("网易新闻");
			titleContainer.add("网易体育");

			pager.setAdapter(new PagerAdapter() {
				@Override
				public int getCount() {
					return viewContainter.size();
				}

				@Override
				public void destroyItem(ViewGroup container, int position,
										Object object) {
					((ViewPager) container).removeView(viewContainter.get(position));
				}

				//每次滑动的时候生成的组件
				@Override
				public Object instantiateItem(ViewGroup container, int position) {
					((ViewPager) container).addView(viewContainter.get(position));
					return viewContainter.get(position);
				}

				@Override
				public boolean isViewFromObject(View arg0, Object arg1) {
					return arg0 == arg1;
				}

				@Override
				public int getItemPosition(Object object) {
					return super.getItemPosition(object);
				}

				@Override
				public CharSequence getPageTitle(int position) {
					return titleContainer.get(position);
				}
			});
			pager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
				@Override
				public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

				}

				@Override
				public void onPageSelected(int position) {

				}

				@Override
				public void onPageScrollStateChanged(int state) {

				}
			});

		}
	配合 Fragment 使用
	XML:
		 <android.support.v4.view.ViewPager
			android:layout_width="match_parent"
			android:layout_height="1000dp"
			android:id="@+id/viewPager">
			<android.support.v4.view.PagerTabStrip
				android:id="@+id/tabstrip"
				android:layout_width="wrap_content"
				android:layout_height="50dip"
				android:gravity="center" />
		</android.support.v4.view.ViewPager>
	JAVA:
		 List<Fragment> fragmentList = new ArrayList<Fragment>();
    List<String>   titleList    = new ArrayList<String>();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.tab);
        ViewPager vp = (ViewPager)findViewById(R.id.viewPager);
        fragmentList.add(new ViewPagerFragment1("页面1"));
        fragmentList.add(new ViewPagerFragment1("页面2"));
        fragmentList.add(new ViewPagerFragment1("页面3"));
        titleList.add("title 1 ");
        titleList.add("title 2 ");
        titleList.add("title 3 ");
        vp.setAdapter(new myPagerAdapter(getSupportFragmentManager(), fragmentList, titleList));
    }
    class myPagerAdapter extends FragmentPagerAdapter {
        private List<Fragment> fragmentList;
        private List<String>   titleList;
        public myPagerAdapter(FragmentManager fm, List<Fragment> fragmentList, List<String> titleList){
            super(fm);
            this.fragmentList = fragmentList;
            this.titleList = titleList;
        }
        @Override
        public Fragment getItem(int arg0) {
            return (fragmentList == null || fragmentList.size() == 0) ? null : fragmentList.get(arg0);
        }
        @Override
        public CharSequence getPageTitle(int position) {
            return (titleList.size() > position) ? titleList.get(position) : "";
        }
        @Override
        public int getCount() {
            return fragmentList == null ? 0 : fragmentList.size();
        }
    }
    public class ViewPagerFragment1 extends Fragment {
        public ViewPagerFragment1(String text){
            super();
        }
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
            View v = inflater.inflate(R.layout.xxx, container, false);
            return v;
        }
    }

	
# SwipeRefreshLayout 下拉刷新
	XML 
		<android.support.v4.widget.SwipeRefreshLayout
			android:id="@+id/swipe_container"
			android:layout_width="match_parent"
			android:layout_height="match_parent" >
			<!--不用ScrollView 会导致加载图标被覆盖-->
			<ScrollView
				android:layout_width="match_parent"
				android:layout_height="wrap_content" >
				<TextView
					android:id="@+id/textView1"
					android:layout_width="match_parent"
					android:layout_height="wrap_content"
					android:gravity="center"
					android:paddingTop="10dp"
					android:text="zzzzzzzzz"
					android:textSize="20sp"
					android:textStyle="bold" />
			</ScrollView>
		</android.support.v4.widget.SwipeRefreshLayout>
	JAVA:
		final SwipeRefreshLayout swipeRefreshLayout = (SwipeRefreshLayout)findViewById(R.id.swipe_container);
        //设置刷新时动画的颜色,可以设置4个
        swipeRefreshLayout.setColorSchemeResources(android.R.color.holo_blue_light, android.R.color.holo_red_light, android.R.color.holo_orange_light, android.R.color.holo_green_light);
        swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                Log.i("SwipeRefreshLayout","REFRESH");
                new Handler().postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        Log.i("SwipeRefreshLayout", "REFRESH OK");
                        swipeRefreshLayout.setRefreshing(false);
                    }
                }, 6000);
            }
        });

带上拉加载的 SwipeRefreshLayout
	compile ‘com.demievil.library:refreshlayout:1.0.0@aar‘
	

SlidingPaneLayout 左右面板 [右边移动]
	XML:
		<android.support.v4.widget.SlidingPaneLayout xmlns:android="http://schemas.android.com/apk/res/android"
			xmlns:tools="http://schemas.android.com/tools"
			android:id="@+id/slidingpanellayout"
			android:layout_width="match_parent"
			android:layout_height="match_parent"
			tools:context=".MainActivity" >
			<fragment
				android:id="@+id/leftfragment"
				android:name="com.example.dome2.tabactivity$BookMarkerFragment"
				android:layout_width="100dp"
				android:layout_height="match_parent"
				android:layout_gravity="left" />
			<fragment
				android:id="@+id/rightfragment"
				android:name="com.example.dome2.tabactivity$BookMarkerFragment2"
				android:layout_width="match_parent"
				android:layout_height="match_parent"
				android:layout_gravity="right"
				android:layout_weight="1" />
		</android.support.v4.widget.SlidingPaneLayout>
	JAVA:
		 @Override
		protected void onCreate(Bundle savedInstanceState) {
			super.onCreate(savedInstanceState);
			setContentView(R.layout.tab);


			SlidingPaneLayout spl = (SlidingPaneLayout) this.findViewById(R.id.slidingpanellayout);
			spl.setPanelSlideListener(new SlidingPaneLayout.PanelSlideListener() {
				@Override
				public void onPanelClosed(View view) {
					//面板打开
				}
				@Override
				public void onPanelOpened(View viw) {
					//面板关闭
				}
				@Override
				public void onPanelSlide(View arg0, float arg1) {

				}
			});
		}
		public static class BookMarkerFragment extends Fragment {
			@Override
			public View onCreateView(LayoutInflater inflater, ViewGroup container,
									 Bundle savedInstanceState) {
				View view = inflater.inflate(R.layout.xxx, container, false);
				return view;
			}
		}
		public static class BookMarkerFragment2 extends Fragment {
			@Override
			public View onCreateView(LayoutInflater inflater, ViewGroup container,
									 Bundle savedInstanceState) {
				View view = inflater.inflate(R.layout.xxx, container, false);
				return view;
			}
		}

DrawerLayout 左右面板 [右边固定]
	XML:
		<android.support.v4.widget.DrawerLayout
			android:id="@+id/drawer_layout"
			android:layout_width="match_parent"
			android:layout_height="match_parent" >

			<!-- The main content view -->

			<FrameLayout
				android:id="@+id/content_frame"
				android:layout_width="match_parent"
				android:layout_height="match_parent" >

				<Button
					android:id="@+id/btn"
					android:layout_width="match_parent"
					android:layout_height="wrap_content"
					android:text="open"
					/>
			</FrameLayout>

			<!-- The navigation drawer -->

			<ListView
				android:id="@+id/left_drawer"
				android:layout_width="240dp"
				android:layout_height="match_parent"
				android:layout_gravity="start"
				android:background="#111"
				android:choiceMode="singleChoice"
				android:divider="@android:color/transparent"
				android:dividerHeight="0dp" />
		</android.support.v4.widget.DrawerLayout>
	JAVA:
		final DrawerLayout mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        Button button = (Button) findViewById(R.id.btn);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 按钮按下,将抽屉打开
                mDrawerLayout.openDrawer(Gravity.LEFT);

            }
        });

FrameLayout 层叠显示
	
	
LinearLayout 线性排列

TableLayout TableRow 表格排列

GridLayout 格子

RelativeLayout 相对排列

LinearLayoutCompat 线性布局 每个组件间加 divider
	XML:
		<android.support.v7.widget.LinearLayoutCompat
			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"
			android:padding="20dip"
			android:orientation="vertical"
			app:divider="@drawable/line"
			app:dividerPadding="5dp"
			app:showDividers="beginning|middle|end" >

			<TextView
				android:layout_width="match_parent"
				android:layout_height="wrap_content"
				android:gravity="center"
				android:text="CSDN Zhang Phil" />
			<TextView
				android:layout_width="match_parent"
				android:layout_height="wrap_content"
				android:gravity="center"
				android:text="CSDN Zhang Phil" />
			<TextView
				android:layout_width="match_parent"
				android:layout_height="wrap_content"
				android:gravity="center"
				android:text="CSDN Zhang Phil" />
		</android.support.v7.widget.LinearLayoutCompat>


 

  

Android 常用布局视图

标签:

原文地址:http://www.cnblogs.com/liushannet/p/5020104.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!