精华内容
下载资源
问答
  • Android linearlayout

    2020-07-18 13:33:07
    LinearLayout简单来说就是线性布局,线性肯定是具有横竖两种方向的,水平和垂直。 在使用LinearLayout的时候,需要注意以下几点 2.排列方式(orientation) 排列方式有水平和垂直两种方式 在xml文件中: ...

    1.线性布局 LinearLayout

    LinearLayout简单来说就是线性布局,线性肯定是具有横竖两种方向的,水平和垂直。

    在使用LinearLayout的时候,需要注意以下几点

    2.排列方式(orientation)

    排列方式有水平和垂直两种方式

    在xml文件中:

     

    android:orientation="vertical"   // 垂直排列
    android:orientation="horizontal" // 水平排列
    

    在java代码中:

     

    linearLayout.setOrientation(LinearLayout.VERTICAL);  // 设置垂直排列
    linearLayout.setOrientation(LinearLayout.HORIZONTAL);// 设置水平排列
    

    这里需要注意:

    android:orientation="vertical",子View使用layout_gravity在垂直方向上的设定无效
    android:orientation="horizontal",子View使用layout_gravity在水平方向上的设定无效

    3.摆放位置(gravity/layout_gravity)

    上面讲到了排列问题,这里在来讲一下摆放问题

    • gravity是针对当前控件里面内容的摆放,如果是容器,则针对的是容器里面子view的摆放;如果是控件,则针对的是控件里面内容的摆放。

    • layout_gravity是指当前控件在父控件里面的摆放位置,不过需要注意的一点是父控件设置的gravity的级别要低于子控件设置的layout_gravity。

    我们来分析其中的一种情况然后来做个总结。

    LinearLayout的排列方式为vertical,优先级最高。当LinearLayout设置了gravity,都是在LinearLayout排列方式为vertical,LinearLayout设置了gravity之后的位置重新来进行排列的。如果子view设置了layout_gravity的话,那么子View的排列方式按子View设置的为主,下面看个例子:

     

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_horizontal"
        android:orientation="vertical">
     
        <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="hello"/>
     
        <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:padding="5dp"
            android:text="hello"/>
     
        <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="hello"/>
     
    </LinearLayout>
    

    gravity_image

    可以看到第二个TextView设置的layout_gravity为center_vertical,表示生效的是layout_gravity为center_vertical。所以layout_gravity相当于只设定了center_vertical(不生效)而没有设定center_horizontal,所有就出现了图中的情况。可以总结为如果父控件设置了gravity的同时,子View设置了layout_gravity,那么以子View设定的为准。

    3.1 权重(layout_weight)

    • layout_weight

    在LinearLayout布局之中,权重也是一个很重要的属性。简单来说就是按比例来分配控件占用父控件的大小。

    若C-child表示子布局声明的大小,B-blank表示剩余布局的大小,P-percent表示子布局占据父布局剩余布局的比例,则子布局最终的实际大小R-reality为:

    R = C + B * P

     

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    weight_image

    我们来按照公式来计算

    R = C + B * P = 0dp + (B-0dp-0dp) * (1/2) = (1/2)B

    也就是父布局的1/2。

    • weightSum

    LinearLayout有一个权重数量的标记:weightSum。在LinearLayout中没有声明weightSum时,默认的就是各个控件权重的总和。上面的例子,默认的weightSum就是2。接下来我们再看一个例子:

    这里我将weightSum设置为4。

     

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="4"
        android:orientation="horizontal">
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    布局的显示如下:

    weight_image

    • 0dp与wrap_content

    谷歌官方建议子布局的layout_width使用0dp,来分比例显示布局,和wrap_content大同小异,当使用layout_weight时,都表示占据剩余宽度或高度的比重。

    但两者有明显区别。

    使用0dp时,要考虑所分配的布局宽度是否小于控件实际宽度,比如:

     

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="19"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    则显示为如下:

    weight_image

    而使用wrap_content则不会出现上面的那种情况

     

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="19"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    weight_image

    这里left先获取自适应的大小,然后再去获取剩余布局的1/20。

    • 0dp与match_parent

    可以发现match_parent是与0dp的效果是相反的

     

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    weight_image

    这看起来很奇怪,那么我们通过公式来计算。以left为例子

    B是剩余布局的大小 = 父布局大小 - 子控件大小之和

    B = C - (C + C) = -C;

    R = C + B * P = C + (-C) * (1/3) = 2/3C
    这里的C就是父布局的大小也就是match_parent。

    4.总结

    • LinearLayout的排列方式有垂直和水平

    • 当LinearLayout的排列方式为vertical,也就是垂直方向时:

      LinearLayout里面的子view设置layout_gravity在垂直方向上的设定是无效的。并且子view设定的layout_gravity是在前两个的基础位置上来进行摆放的。

    • 当LinearLayout的排列方式为horizontal,也就是水平方向时:

      LinearLayout里面的子view设置layout_gravity在水平方向上的设定是无效的。并且子view设定的layout_gravity是在前两个的基础位置上来进行摆放的。

    • 权重需要记住的就是公式

      控件的实际大小 = 控件设定的大小 + (布局剩余的大小) * 布局的比例

      布局剩余的大小 = 父布局的大小 - 子布局大小之和



    作者:MrChen丶
    链接:https://www.jianshu.com/p/033b69c04dbf
    来源:简书
    著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

    展开全文
  • 右边的箭头这三个所占用的宽度,都是规定死的,所以横竖屏切换的时候,需要设置中间文字部分的LinearLayout 的宽度了。 首先得到是否是宽屏, WindowManager windowManager = getWindowManager(); Display ...
      
    

    最近做一个页面,仿制以下两个图,一个是横屏,一个竖屏。这是一款名字叫IMDb的手机软件,其中最上面中间是一个图;然后下来是三个tab样式的(Movies、TV、People)三个可以切换,切换是三个不同页面;下面是一个横排的图片,图片可以左右滑动显示;下面是一个list列表,此列表每一行最左边是一个图片,中间是文字,最右边是一个小箭头图标。

    device device1

    首先解决的是最上面图片居中显示,在LinearLayout标签中加入android:gravity="center_horizontal",这个表示横向居中显示。这样的话切换横竖屏之后,图片也是在中间的。

    再次,解决三个(Movies、TV、People)三个可以切换的页面。开始想到用tab标签来实现,后来发现tab只能用在头部而且最上面不能有图片。所以尝试了大概1-2个小时后,放弃使用tab,改用LinearLayout来控制,每点不同的LinearLayout时,页面显示不同,

    具体代码如下:在main.xml中,

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="vertical" android:layout_width="fill_parent"
            android:layout_height="wrap_content" android:gravity="top">
            <include layout="@layout/foot" />
        </LinearLayout>

    这里用到了include标签,是引用另外一个页面的意思,类似与html中的include ,效果类似,将foot.xml文件中的页面显示在此LinearLayout中,

    foot.xml文件如下:最外是一个横排的LinearLayout ,里面包裹三个LinearLayout,背景设置为灰色。代码如下,其中一个

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal" android:layout_width="fill_parent"
        android:layout_height="wrap_content">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:id="@+id/Movies"
        android:background="@drawable/tab_one_normal" android:gravity="center_horizontal">
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="Movies"
            android:gravity="center" android:paddingTop="5px"
            android:textColor="#FFFFFF" android:textSize="20px"
            android:textStyle="bold"/>
    </LinearLayout>
    <ImageView android:layout_width="wrap_content"
            android:layout_height="wrap_content"  android:src="@drawable/line" />

    在Java类中:默认movies为选中的LinearLayout,对每个LinearLayout进行监听,点击之后背景变化,原来被点中的LinearLayout则变为灰色,点中的变为黑色。

    private LinearLayout movies, tv, people;

    movies = (LinearLayout) findViewById(R.id.Movies);
    tv = (LinearLayout) findViewById(R.id.TV);
    people = (LinearLayout) findViewById(R.id.People);

    movies.setBackgroundResource(R.drawable.tab_two_highlight);//默认为选中的LinearLayout

    movies.setOnClickListener(new OnClickListener() {
                @Override
    public void onClick(View v) {
            movies.setBackgroundResource(R.drawable.tab_two_highlight);
            tv.setBackgroundResource(R.drawable.tab_one_normal);
            people.setBackgroundResourc(R.drawable.tab_one_normal);
                    
            }
    });

    这样就完成了最上边的两部分,效果如下图:

    image

    接下来,该横向显示图片;这里使用了android apidemo中的一个例子,大家也可以参考,在view-》Gallery1中。

    这里使用到了Gallery标签,具体实现如下:

    在main.xml中使用<include layout="@layout/imagegallery" />

    imagegallery.xml文件中:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:background="#FFFFFF"
        android:layout_marginBottom="10px">
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="vertical" android:layout_width="fill_parent"
            android:layout_height="wrap_content" android:background="#FFFFFF"
            android:paddingTop="10px" android:paddingLeft="7px">
            <TextView android:layout_width="fill_parent"
                android:layout_height="wrap_content" android:text="这是一个画廊"
                android:textColor="#000000" android:paddingLeft="5px"
                android:id="@+id/iamge_text" />
        </LinearLayout>
        <Gallery android:id="@+id/myGallery" android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
    </LinearLayout>

    在value文件夹下新建attrs.xml(这里apidemo中就是这么使用的,所以照葫芦画瓢呗),文件内容如下:

    <resources>
        <!– These are the attributes that we want to retrieve from the theme
             in view/Gallery1.java –>
        <declare-styleable name="Gallery1">
            <attr name="android:galleryItemBackground" />
        </declare-styleable>
         <declare-styleable name="LabelView">
            <attr name="text" format="string" />
            <attr name="textColor" format="color" />
            <attr name="textSize" format="dimension" />
        </declare-styleable>
    </resources>

    然后在ImageAdapter.java文件中:

    继承BaseAdapter,编写它的四个方法,getCount得到图片的个数,getItem和getItemId,得到图片的id,getView(int position, View convertView, ViewGroup parent)得到视图。

    构造方法public ImageAdapter(Context context),

    具体代码如下:

    public class ImageAdapter extends BaseAdapter{
        int mGalleryItemBackground;
        private Context mContext;
        private Integer[] mImageIds = {
                R.drawable.gallery_photo_1,
                R.drawable.gallery_photo_2,
                R.drawable.gallery_photo_3,
                R.drawable.gallery_photo_4,
                R.drawable.gallery_photo_5,
                R.drawable.gallery_photo_6,
                R.drawable.gallery_photo_7,
                R.drawable.gallery_photo_8
        };
        public ImageAdapter(Context context){
            mContext = context;
            TypedArray typedArray = context.obtainStyledAttributes(R.styleable.Gallery1);
            mGalleryItemBackground = typedArray.getResourceId(
                    R.styleable.Gallery1_android_galleryItemBackground, 0);
            typedArray.recycle();
        }
        @Override
        public int getCount() {
            return mImageIds.length;
        }

        @Override
        public Object getItem(int position) {
            return position;
        }

        @Override
        public long getItemId(int position) {
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ImageView imageView = new ImageView(mContext);
            imageView.setImageResource(mImageIds[position]);
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            imageView.setLayoutParams(new Gallery.LayoutParams(138,100));
            imageView.setPadding(0, 1, 15, 0);
            imageView.setBackgroundResource(mGalleryItemBackground);
            return imageView;
        }
    }

    在IMDbDemo主类中加入:

    private Gallery gallery;

    oncreate方法中加入:

    gallery = (Gallery)findViewById(R.id.myGallery);

    gallery.setAdapter(new ImageAdapter(movies.getContext()));

    gallery.setSelection(1);//图片第二个被选中

    默认是movies点中时,显示movies下的横排图片,

    另外建立两个类,类似ImageAdapter,只需将Integer[] mImageIds下的图片id 改变即可,然后在点击的时候,使用下面两个方法,将ImageAdapter改成具体的类名字,将movies.getContext()改成具体的tv或者是people的context即可。

    gallery.setAdapter(new ImageAdapter(movies.getContext()));

    gallery.setSelection(1);//图片第二个被选中

    尝试一下,是否效果如原版?这里有些滥竽充数的概念,首先,原版中图片是顶在左侧的,而我使用setSelection方法,让它首次定义在第二个图片上,这里的图片宽度是计算好了的,竖屏宽是320px,Gallery.LayoutParams(138,100));属性是设置了一下选中的那个图片的宽度和高度,所以,看起来显示效果跟原版是一样的,其实是赖于充数。如果切换成横屏的话,则应该默认应该定义在第二个图片上,这样就跟原版的保持一致了。

    效果图如下:

    image

    最后是最下面的list了,这里主要说一下横竖屏切换的问题。原版中那三个(Movies、TV、People)横竖屏切换后长度随之变化,而且下面的list,不能说是list,应该说是类似list的视图中,每一行最右边的小箭头都是靠右的,但是我这里每规定一个list的时候都是固定左边的图标,中间的文字,右边的箭头这三个所占用的宽度,都是规定死的,所以横竖屏切换的时候,需要设置中间文字部分的LinearLayout 的宽度了。

    首先得到是否是宽屏,

    WindowManager windowManager = getWindowManager();
    Display display = windowManager.getDefaultDisplay();
    screenWidth = display.getWidth();
    screenHeight = display.getHeight();

    if(screenWidth>screenHeight)表示竖屏

    使用下面的方法,设置LinearLayout的宽,高;第一个参数是宽,第二个参数是高。

    movies.setLayoutParams(new LinearLayout.LayoutParams(189,40));
    tv.setLayoutParams(new LinearLayout.LayoutParams(189,40));
    people.setLayoutParams(new LinearLayout.LayoutParams(189,40));

    这里要提一点,getWindowManager();我一直没有搞明白到底是什么.getWindowManager();所以在我的list中,无法得到屏幕的宽和高,这里,王老师教了一招,就是创建ListAdapter的时候直接告诉这个ListAdapter是横屏还是竖屏,所以在ListAdapter类中,构造方法中,加入了一个布尔类型的参数,具体代码如下:

    public ListAdapter(Context context, int textViewResourceId,
                List<String> list,Boolean bl) {
            super(context, textViewResourceId,list);
            item = list;
            screen = bl;
        }

    然后再设置文字所在的LinearLayout的宽度和高度。这样就解决了横竖屏的所有的问题,效果图如下:

    device3 device4

    最后遗留一个问题:

    就是官方文档中有说在ScollView中不要添加ListView,否则ListView是显示不正常的,试验过,确实如官方文档所说,起码2.1之前的都是这样效果,ListView只显示一个List那样的高度。而原版中可以看到除了最上边的无法滑动外,整个下边的包括横排的图,整个都可以上下滑动的,这样有利于在切换成横屏的时候下面不至于太少的空间而看不全。我只有一种解释这样的效果,就是写死了下面的内容,不使用ListView。因为我看了网上解决这个bug的方法在我这里都没见到效果。我也比较赞成网上最欠抽的方法,最好两个不缠在一块儿使用。

    源代码见:http://henzil.googlecode.com/svn/trunk/android.IMDbDemo/

     

    You can leave a response, or trackback from your own site.

    One Response to “横竖屏切换+Gallery使用+LinearLayout模仿tab”

    1. qmiao128 说:

      楼主:
      你对TabHost的理解有所偏颇,TabHost并没有只是TabActivity这么简单,完全可以自己去实现TabWidget的样式和位置,可以参考Contacts里面的tab,有些就是放在下面的。

    展开全文
  • 右边的箭头这三个所占用的宽度,都是规定死的,所以横竖屏切换的时候,需要设置中间文字部分的LinearLayout 的宽度了。 首先得到是否是宽屏, WindowManager windowManager = getWindowManager();  Display ...

    最近做一个页面,仿制以下两个图,一个是横屏,一个竖屏。这是一款名字叫IMDb的手机软件,其中最上面中间是一个图;然后下来是三个tab样式的(Movies、TV、People)三个可以切换,切换是三个不同页面;下面是一个横排的图片,图片可以左右滑动显示;下面是一个list列表,此列表每一行最左边是一个图片,中间是文字,最右边是一个小箭头图标。

    device device1

     

    首先解决的是最上面图片居中显示,在LinearLayout标签中加入android:gravity="center_horizontal",这个表示横向居中显示。这样的话切换横竖屏之后,图片也是在中间的。

    再次,解决三个(Movies、TV、People)三个可以切换的页面。开始想到用tab标签来实现,后来发现tab只能用在头部而且最上面不能有图片。所以尝试了大概1-2个小时后,放弃使用tab,改用LinearLayout来控制,每点不同的LinearLayout时,页面显示不同,

    具体代码如下:在main.xml中,

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
            android:orientation="vertical" android:layout_width="fill_parent" 
            android:layout_height="wrap_content" android:gravity="top"> 
            <include layout="@layout/foot" /> 
        </LinearLayout>

    这里用到了include标签,是引用另外一个页面的意思,类似与html中的include ,效果类似,将foot.xml文件中的页面显示在此LinearLayout中,

    foot.xml文件如下:最外是一个横排的LinearLayout ,里面包裹三个LinearLayout,背景设置为灰色。代码如下,其中一个

    <?xml version="1.0" encoding="utf-8"?> 
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        android:orientation="horizontal" android:layout_width="fill_parent" 
        android:layout_height="wrap_content">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        android:orientation="vertical" android:layout_width="wrap_content" 
        android:layout_height="wrap_content" android:id="@+id/Movies" 
        android:background="@drawable/tab_one_normal" android:gravity="center_horizontal"> 
        <TextView android:layout_width="wrap_content" 
            android:layout_height="wrap_content" android:text="Movies" 
            android:gravity="center" android:paddingTop="5px" 
            android:textColor="#FFFFFF" android:textSize="20px" 
            android:textStyle="bold"/> 
    </LinearLayout> 
    <ImageView android:layout_width="wrap_content" 
            android:layout_height="wrap_content"  android:src="@drawable/line" />

    在Java类中:默认movies为选中的LinearLayout,对每个LinearLayout进行监听,点击之后背景变化,原来被点中的LinearLayout则变为灰色,点中的变为黑色。

    private LinearLayout movies, tv, people;

    movies = (LinearLayout) findViewById(R.id.Movies); 
    tv = (LinearLayout) findViewById(R.id.TV); 
    people = (LinearLayout) findViewById(R.id.People);

    movies.setBackgroundResource(R.drawable.tab_two_highlight);//默认为选中的LinearLayout

    movies.setOnClickListener(new OnClickListener() { 
                @Override 
    public void onClick(View v) { 
            movies.setBackgroundResource(R.drawable.tab_two_highlight); 
            tv.setBackgroundResource(R.drawable.tab_one_normal); 
            people.setBackgroundResourc(R.drawable.tab_one_normal); 
                     
            } 
    });

    这样就完成了最上边的两部分,效果如下图:

    image

    接下来,该横向显示图片;这里使用了android apidemo中的一个例子,大家也可以参考,在view-》Gallery1中。

    这里使用到了Gallery标签,具体实现如下:

    在main.xml中使用<include layout="@layout/imagegallery" />

    imagegallery.xml文件中:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        android:orientation="vertical" android:layout_width="fill_parent" 
        android:layout_height="wrap_content" android:background="#FFFFFF" 
        android:layout_marginBottom="10px"> 
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
            android:orientation="vertical" android:layout_width="fill_parent" 
            android:layout_height="wrap_content" android:background="#FFFFFF"
            android:paddingTop="10px" android:paddingLeft="7px"> 
            <TextView android:layout_width="fill_parent" 
                android:layout_height="wrap_content" android:text="这是一个画廊" 
                android:textColor="#000000" android:paddingLeft="5px" 
                android:id="@+id/iamge_text" /> 
        </LinearLayout> 
        <Gallery android:id="@+id/myGallery" android:layout_width="fill_parent" 
            android:layout_height="wrap_content" /> 
    </LinearLayout>

    在value文件夹下新建attrs.xml(这里apidemo中就是这么使用的,所以照葫芦画瓢呗),文件内容如下:

    <resources> 
        <!– These are the attributes that we want to retrieve from the theme 
             in view/Gallery1.java –> 
        <declare-styleable name="Gallery1"> 
            <attr name="android:galleryItemBackground" /> 
        </declare-styleable> 
         <declare-styleable name="LabelView"> 
            <attr name="text" format="string" /> 
            <attr name="textColor" format="color" /> 
            <attr name="textSize" format="dimension" /> 
        </declare-styleable> 
    </resources>

    然后在ImageAdapter.java文件中:

    继承BaseAdapter,编写它的四个方法,getCount得到图片的个数,getItem和getItemId,得到图片的id,getView(int position, View convertView, ViewGroup parent)得到视图。

    构造方法public ImageAdapter(Context context),

    具体代码如下:

    public class ImageAdapter extends BaseAdapter{ 
        int mGalleryItemBackground; 
        private Context mContext; 
        private Integer[] mImageIds = { 
                R.drawable.gallery_photo_1, 
                R.drawable.gallery_photo_2, 
                R.drawable.gallery_photo_3, 
                R.drawable.gallery_photo_4, 
                R.drawable.gallery_photo_5, 
                R.drawable.gallery_photo_6, 
                R.drawable.gallery_photo_7, 
                R.drawable.gallery_photo_8 
        }; 
        public ImageAdapter(Context context){ 
            mContext = context; 
            TypedArray typedArray = context.obtainStyledAttributes(R.styleable.Gallery1); 
            mGalleryItemBackground = typedArray.getResourceId( 
                    R.styleable.Gallery1_android_galleryItemBackground, 0); 
            typedArray.recycle(); 
        } 
        @Override 
        public int getCount() { 
            return mImageIds.length; 
        }

        @Override 
        public Object getItem(int position) { 
            return position; 
        }

        @Override 
        public long getItemId(int position) { 
            return position; 
        }

        @Override 
        public View getView(int position, View convertView, ViewGroup parent) { 
            ImageView imageView = new ImageView(mContext); 
            imageView.setImageResource(mImageIds[position]); 
            imageView.setScaleType(ImageView.ScaleType.FIT_XY); 
            imageView.setLayoutParams(new Gallery.LayoutParams(138,100)); 
            imageView.setPadding(0, 1, 15, 0); 
            imageView.setBackgroundResource(mGalleryItemBackground); 
            return imageView; 
        } 
    }

    在IMDbDemo主类中加入:

    private Gallery gallery;

    oncreate方法中加入:

    gallery = (Gallery)findViewById(R.id.myGallery);

    gallery.setAdapter(new ImageAdapter(movies.getContext()));

    gallery.setSelection(1);//图片第二个被选中

    默认是movies点中时,显示movies下的横排图片,

    另外建立两个类,类似ImageAdapter,只需将Integer[] mImageIds下的图片id 改变即可,然后在点击的时候,使用下面两个方法,将ImageAdapter改成具体的类名字,将movies.getContext()改成具体的tv或者是people的context即可。

    gallery.setAdapter(new ImageAdapter(movies.getContext()));

    gallery.setSelection(1);//图片第二个被选中

    尝试一下,是否效果如原版?这里有些滥竽充数的概念,首先,原版中图片是顶在左侧的,而我使用setSelection方法,让它首次定义在第二个图片上,这里的图片宽度是计算好了的,竖屏宽是320px,Gallery.LayoutParams(138,100));属性是设置了一下选中的那个图片的宽度和高度,所以,看起来显示效果跟原版是一样的,其实是赖于充数。如果切换成横屏的话,则应该默认应该定义在第二个图片上,这样就跟原版的保持一致了。

    效果图如下:

    image

    最后是最下面的list了,这里主要说一下横竖屏切换的问题。原版中那三个(Movies、TV、People)横竖屏切换后长度随之变化,而且下面的list,不能说是list,应该说是类似list的视图中,每一行最右边的小箭头都是靠右的,但是我这里每规定一个list的时候都是固定左边的图标,中间的文字,右边的箭头这三个所占用的宽度,都是规定死的,所以横竖屏切换的时候,需要设置中间文字部分的LinearLayout 的宽度了。

    首先得到是否是宽屏,

    WindowManager windowManager = getWindowManager(); 
    Display display = windowManager.getDefaultDisplay(); 
    screenWidth = display.getWidth(); 
    screenHeight = display.getHeight();

    if(screenWidth>screenHeight)表示竖屏

    使用下面的方法,设置LinearLayout的宽,高;第一个参数是宽,第二个参数是高。

    movies.setLayoutParams(new LinearLayout.LayoutParams(189,40)); 
    tv.setLayoutParams(new LinearLayout.LayoutParams(189,40)); 
    people.setLayoutParams(new LinearLayout.LayoutParams(189,40));

    这里要提一点,getWindowManager();我一直没有搞明白到底是什么.getWindowManager();所以在我的list中,无法得到屏幕的宽和高,这里,王老师教了一招,就是创建ListAdapter的时候直接告诉这个ListAdapter是横屏还是竖屏,所以在ListAdapter类中,构造方法中,加入了一个布尔类型的参数,具体代码如下:

    public ListAdapter(Context context, int textViewResourceId, 
                List<String> list,Boolean bl) { 
            super(context, textViewResourceId,list); 
            item = list; 
            screen = bl; 
        }

    然后再设置文字所在的LinearLayout的宽度和高度。这样就解决了横竖屏的所有的问题,效果图如下:

    device3 device4

    最后遗留一个问题:

    就是官方文档中有说在ScollView中不要添加ListView,否则ListView是显示不正常的,试验过,确实如官方文档所说,起码2.1之前的都是这样效果,ListView只显示一个List那样的高度。而原版中可以看到除了最上边的无法滑动外,整个下边的包括横排的图,整个都可以上下滑动的,这样有利于在切换成横屏的时候下面不至于太少的空间而看不全。我只有一种解释这样的效果,就是写死了下面的内容,不使用ListView。因为我看了网上解决这个bug的方法在我这里都没见到效果。我也比较赞成网上最欠抽的方法,最好两个不缠在一块儿使用。

    源代码见:http://henzil.googlecode.com/svn/trunk/android.IMDbDemo/

    转载于:https://www.cnblogs.com/keis/archive/2011/03/20/1989460.html

    展开全文
  • 文章目录1.线性布局 LinearLayout2.排列方式(orientation)3....LinearLayout简单来说就是线性布局,线性肯定是具有横竖两种方向的,水平和垂直。 在使用LinearLayout的时候,需要注意一下几点 2.排列方式(or...

    1.线性布局 LinearLayout

    LinearLayout简单来说就是线性布局,线性肯定是具有横竖两种方向的,水平和垂直。

    在使用LinearLayout的时候,需要注意以下几点

    2.排列方式(orientation)

    排列方式有水平和垂直两种方式

    在xml文件中:

    android:orientation="vertical"   // 垂直排列
    android:orientation="horizontal" // 水平排列
    

    在java代码中:

    linearLayout.setOrientation(LinearLayout.VERTICAL);  // 设置垂直排列
    linearLayout.setOrientation(LinearLayout.HORIZONTAL);// 设置水平排列
    

    这里需要注意:

    android:orientation=“vertical”,子View使用layout_gravity在垂直方向上的设定无效
    android:orientation=“horizontal”,子View使用layout_gravity在水平方向上的设定无效

    3.摆放位置(gravity/layout_gravity)

    上面讲到了排列问题,这里在来讲一下摆放问题

    • gravity是针对当前控件里面内容的摆放,如果是容器,则针对的是容器里面子view的摆放;如果是控件,则针对的是控件里面内容的摆放。

    • layout_gravity是指当前控件在父控件里面的摆放位置,不过需要注意的一点是父控件设置的gravity的级别要低于子控件设置的layout_gravity。

    我们来分析其中的一种情况然后来做个总结。

    LinearLayout的排列方式为vertical,优先级最高。当LinearLayout设置了gravity,都是在LinearLayout排列方式为vertical,LinearLayout设置了gravity之后的位置重新来进行排列的。如果子view设置了layout_gravity的话,那么子View的排列方式按子View设置的为主,下面看个例子:

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_horizontal"
        android:orientation="vertical">
     
        <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="hello"/>
     
        <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:padding="5dp"
            android:text="hello"/>
     
        <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="hello"/>
     
    </LinearLayout>
    

    image

    可以看到第二个TextView设置的layout_gravity为center_vertical,表示生效的是layout_gravity为center_vertical。所以layout_gravity相当于只设定了center_vertical(不生效)而没有设定center_horizontal,所有就出现了图中的情况。可以总结为如果父控件设置了gravity的同时,子View设置了layout_gravity,那么以子View设定的为准。

    3.1 权重(layout_weight)

    • layout_weight

    在LinearLayout布局之中,权重也是一个很重要的属性。简单来说就是按比例来分配控件占用父控件的大小。

    若C-child表示子布局声明的大小,B-blank表示剩余布局的大小,P-percent表示子布局占据父布局剩余布局的比例,则子布局最终的实际大小R-reality为:

    R = C + B * P

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    image

    我们来按照公式来计算

    R = C + B * P = 0dp + (B-0dp-0dp) * (1/2) = (1/2)B

    也就是父布局的1/2。

    • weightSum

    LinearLayout有一个权重数量的标记:weightSum。在LinearLayout中没有声明weightSum时,默认的就是各个控件权重的总和。上面的例子,默认的weightSum就是2。接下来我们再看一个例子:

    这里我将weightSum设置为4。

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="4"
        android:orientation="horizontal">
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    布局的显示如下:

    image

    • 0dp与wrap_content

    谷歌官方建议子布局的layout_width使用0dp,来分比例显示布局,和wrap_content大同小异,当使用layout_weight时,都表示占据剩余宽度或高度的比重。

    但两者有明显区别。

    使用0dp时,要考虑所分配的布局宽度是否小于控件实际宽度,比如:

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="19"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    则显示为如下:

    image

    而使用wrap_content则不会出现上面的那种情况

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="19"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    image

    这里left先获取自适应的大小,然后再去获取剩余布局的1/20。

    • 0dp与match_parent

    可以发现match_parent是与0dp的效果是相反的

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linear_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
     
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@android:color/holo_blue_dark"
            android:padding="5dp"
            android:text="left"/>
     
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:background="@android:color/holo_green_dark"
            android:gravity="center"
            android:padding="5dp"
            android:text="right"/>
     
    </LinearLayout>
    

    image

    这看起来很奇怪,那么我们通过公式来计算。以left为例子

    B是剩余布局的大小 = 父布局大小 - 子控件大小之和

    B = C - (C + C) = -C;

    R = C + B * P = C + (-C) * (1/3) = 2/3C
    这里的C就是父布局的大小也就是match_parent。

    4.总结

    • LinearLayout的排列方式有垂直和水平

    • 当LinearLayout的排列方式为vertical,也就是垂直方向时:

      LinearLayout里面的子view设置layout_gravity在垂直方向上的设定是无效的。并且子view设定的layout_gravity是在前两个的基础位置上来进行摆放的。

    • 当LinearLayout的排列方式为horizontal,也就是水平方向时:

      LinearLayout里面的子view设置layout_gravity在水平方向上的设定是无效的。并且子view设定的layout_gravity是在前两个的基础位置上来进行摆放的。

    • 权重需要记住的就是公式

      控件的实际大小 = 控件设定的大小 + (布局剩余的大小) * 布局的比例

      布局剩余的大小 = 父布局的大小 - 子布局大小之和

    展开全文
  • Android开发之自动换行LinearLayout

    千次阅读 2015-01-24 11:18:26
    Android开发中,很多人会遇到满行就自动换到下一行的界面需求,而Android自带的LinearLayout布局自能横排或者竖排,不够显示就加ScrollView,横竖混排就不行了。这里给大家分享一个可以实现自动换行的LinearLayout
  • LinearLayout简单来说就是线性布局,线性肯定是具有横竖两种方向的,水平和垂直。 在使用LinearLayout的时候,需要注意以下几点 2.排列方式(orientation) 排列方式有水平和垂直两种方式 在xml文件中: android:...
  • 主要给大家介绍了关于Android自定义LinearLayout但布局显示不完整的解决方法,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
  • Android 横竖屏切换

    2015-10-26 16:44:24
    Android 横竖屏切换 布局文件 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent
  • android:configChanges 屏幕横竖屏切换

    千次阅读 2013-07-19 11:23:10
    android:configChanges="keyboardHidden|orientation" 般在AndroidManifest.xml文件中都没有使用到android:configChanges=...就是如果配置了这个属性,当我们横竖屏切换的时候会直接调用onCreate方法中的onConf
  • 演示效果如下: 另外在竖屏的时候是这样的效果: 布局文件如下: 可以看出有两个资源文件,一个是处理横屏一...<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width=
  • 在页面上写代码,我用的是基础的LinearLayout,并嵌套使用,使得界面横竖有序,更为好看 &lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;LinearLayout xmlns:android="...
  • Android横竖屏切换总结

    2016-04-21 13:52:11
    Android横竖屏切换总结(Android资料) Android横竖屏要解决的问题应该就两个: 一.布局问题 二.重新载入问题 1.布局问题:如果不想让软件在横竖屏之间切换,最简单的办法就是在项目的...
  • 首先,layout_weight这个属性是相对于父布局是LinearLayout来使用的,表示的是该作用的控件在父布局中的权重。 具体计算方式可以参考Android:LinearLayout布局中Layout_weight的深刻理解 原文如下: 首先看一下...
  • android 视频播放 点击横竖屏切换 自动旋转横竖屏切换 冲突
  • 1)由于LinearLayout是View的子类,因此可以使用View.getMeasuredWidth和View.getMeasuredHeight方法来获取组件的宽度和高度。 View view =getLayoutInflater().inflate(R.layout.main,null); LinearLayout ...
  • Android开发中,很多人会遇到满行就自动换到下一行的界面需求,而Android自带的LinearLayout布局自能横排或者竖排,不够显示就加ScrollView,横竖混排就不行了。这里给大家分享一个可以实现自动换行的LinearLayout。...
  • 实现横竖屏切换,第一步就是获取手机屏幕的高度和宽度,然后设置控件VideoView处于横屏或竖屏模式,再设置控件的高度和宽度就可以了。废话不多说,直接上代码,具体的解释也在代码中: 布局代码: &lt;...
  • Fragment横竖屏切换

    千次阅读 2018-04-12 17:52:14
    创建一个横屏LinearLayout ContentActivity.java public class ContentActivity extends FragmentActivity { @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate...
  • android横竖屏管理

    2017-11-07 11:51:25
    1.Android横竖屏系统默认情况 Android横竖屏界面显示默认会沿用上一个界面的横竖屏,即上个界面是横(竖)屏就是横(竖)屏。当正在运行软件时,USB接口突然连接或者突然弹出界面,有几率性的改变当前横竖屏情况,...
  • android,横竖屏切换fragment

    千次阅读 2014-02-23 18:10:10
    fragment1.xml ...<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#ff000
  • 横竖屏切换

    千次阅读 2011-07-06 00:43:04
    问题如下:关于android图片widget横竖屏切换时的问题 我想在一个Activity里面放一张很大的图片,点击后进入另外一个Activity,在不切换横竖屏时一切正常,在横竖屏切换的时候程序就很容易报异常,强行关闭。...
  • 线性布局在生活中还是很常见的,比如手机上的计算器,横竖分明,非常好辨别和使用。 线性布局常用的属性: android:gravity:控件自身上面的内容位置 android:layout_gravity:控件本身相对于父控件的显示
  • Android横竖屏总结

    2015-10-28 16:43:15
    Android横竖屏要解决的问题应该就两个: 一.布局问题 二.重新载入问题 1.布局问题:如果不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,036
精华内容 1,214
关键字:

linearlayout横竖