安卓初学者布局详细讲解

最新推荐文章于 2025-07-18 16:24:52 发布

原创最新推荐文章于 2025-07-18 16:24:52 发布 · 592 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android 初学者布局详解

Android 专栏收录该内容

15 篇文章

订阅专栏

这篇博客详细讲解了安卓开发中LinearLayout和RelativeLayout的使用。对于LinearLayout，介绍了其垂直和水平方向的设置，以及常用属性如id、text、gravity等。在RelativeLayout部分，讲解了如何通过layout_align*属性来精确控制控件的位置。此外，还提到了EditText的hint、view的gravity和layout_gravity属性，以及ImageView的scaleType属性的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、LinearLayout

线线布局具有垂直和水平两种方向，通过设置属性“android:orientation”控制方向，属性值垂直（vertical）和水平(horizontal)，默认水平方向。先讲解一下常用的属性。

1   单个控件经常用到
      android:id —— 为控件指定相应的ID
      android:text —— 指定控件当中显示的文字，需要注意的是，这里尽量使用strings.xml文件当中的字符串
      android:grivity —— 指定控件的基本位置，比如说居中，居右等位置
      android:textSize —— 指定控件当中字体的大小
      android:background —— 指定该控件所使用的背景色,RGB命名法
      android:width —— 指定控件的宽度
      android:height —— 指定控件的高度
      android:padding* —— 指定控件的内边距，也就是说控件当中的内容
    android:sigleLine —— 如果设置为真的话，则将控件的内容在同一行当中进行显示

2 对于magin 和pading各种不理解的也做一个总结

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    android:orientation="horizontal"
    android:padding="30dp"><!--//表示这个view里面的view即linerlayout与该view的边距为30dp-->

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp" ><!--//表示该linerlayout相对于本身与外面的view的边距为10dp-->


        <!--//表示此button相对于本身与外view即linerlayout和button2（可以直接理解成与四周的view）边距为30dp-->
        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="30dp"
          android:text="button1" />
     

        

     <!--   //表示此button相对于本身与左边的view即button1的边距为30dp-->
        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
        android:text="button2" />
    </LinearLayout>
</LinearLayout>

3 ，RelativeLayout

   相对布局时经常用到
       android:layout_above 将该控件的底部至于给定ID的控件之上
       android:layout_below 将该控件的顶部至于给定ID的控件之下
       android:layout_toLeftOf 将该控件的右边缘和给定ID的控件的左边缘对齐
       android:layout_toRightOf 将该控件的左边缘和给定ID的控件的右边缘对齐

       android:layout_alignBaseline 该控件的baseline和给定ID的控件的baseline对齐
      android:layout_alignBottom 将该控件的底部边缘与给定ID控件的底部边缘对齐
      android:layout_alignLeft 将该控件的左边缘与给定ID控件的左边缘对齐
      android:layout_alignRight 将该控件的右边缘与给定ID控件的右边缘对齐
      android:layout_alignTop 将给定控件的顶部边缘与给定ID控件的顶部对齐

     android:alignParentBottom 如果该值为true，则将该控件的底部和父控件的底部对齐
     android:layout_alignParentLeft 如果该值为true，则将该控件的左边与父控件的左边对齐
     android:layout_alignParentRight 如果该值为true，则将该控件的右边与父控件的右边对齐
     android:layout_alignParentTop 如果该值为true，则将空间的顶部与父控件的顶部对齐

      android:layout_centerHorizontal 如果值为真，该控件将被至于水平方向的中央
     android:layout_centerInParent 如果值为真，该控件将被至于父控件水平方向和垂直方向的中央
     android:layout_centerVertical 如果值为真，该控件将被至于垂直方向的中央
     -->

EditText的android:hint

设置EditText为空时输入框内的提示信息。

android:gravity　
android:gravity属性是对该view 内容的限定．比如一个button 上面的text. 你可以设置该text 在view的靠左，靠右等位置．以button为例，android:gravity="right"则button上面的文字靠右

      android:layout_gravity
     android:layout_gravity是用来设置该view相对与起父view 的位置．比如一个button 在linearlayout里，你想把该button放在靠左、靠右等位置就可以通过该属性设置．以button为例，android:layout_gravity="right"则button靠右

      android:layout_alignParentRight
     使当前控件的右端和父控件的右端对齐。这里属性值只能为true或false，默认false。

android:scaleType：
android:scaleType是控制图片如何resized/moved来匹对ImageView的size。ImageView.ScaleType / android:scaleType值的意义区别：

在我们些布局的时候一般是常用

FrameLayout  和  RelativeLayout 是结合一起是是使用的，水平的一般考虑使用线线布局，垂直的一般使用相对布局，配合使用可以减少后面的屏幕适配

這个是我们要实现的效果，首先我们新分析一下這个布局的结构,上面是有一个线线布局包裹所有的内容，居中显示的，然后又分为左边的内容和右边的内容，右边的内容占的多，我们分析左边的内容，左边是垂直结构的，我们会用到相对布局，最底下三个信号符我们又会用到线线布局，写相对布局的时候注意一点，一般是先写中间布局然后它上面的布局在它上面和下面

<?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="#000">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_centerInParent="true">

      <!--包裹整个页面的布局-->
        <LinearLayout
            android:layout_width="490dp"
            android:layout_height="180dp"
            android:orientation="horizontal"
            >

           <!-- 左边的布局-->
            <RelativeLayout
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1">

              <!--  //左边布局的中间的图片-->
                <ImageView
                    android:id="@+id/spacer"
                    android:layout_width="77dp"
                    android:layout_height="77dp"
                    android:layout_centerInParent="true"
                    android:src="@drawable/ic_speech_voice"/>

                <!--信号图片的布局-->
                <LinearLayout
                    android:id="@+id/rl_main_im_sug_item"
                    android:layout_width="match_parent"
                    android:layout_height="46dp"
                    android:layout_alignParentBottom="true"
                    android:layout_centerHorizontal="true"
                    android:layout_marginBottom="15dp"
                    android:orientation="horizontal"
                    android:weightSum="3">

                    <!--为了让三个信号图片所占大小一样使用权重
                    android:layout_weight="1"
                    -->
                    <RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_weight="1">
                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_centerInParent="true"
                            android:src="@drawable/ic_network"/>
                    </RelativeLayout>

                    <RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_weight="1">
                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_centerInParent="true"
                            android:src="@drawable/ic_network"/>
                    </RelativeLayout>

                    <RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_weight="1">
                        <ImageView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_centerInParent="true"
                            android:src="@drawable/ic_network"/>
                    </RelativeLayout>

                </LinearLayout>
                <ImageView
                    android:id="@+id/main_im_back"
                    android:layout_width="52dp"
                    android:layout_height="39dp"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true"
                    android:paddingTop="12dp"
                    android:src="@drawable/ic_back" />
            </RelativeLayout>


           <!-- 右边的布局-->
            <LinearLayout
                android:layout_height="match_parent"
                android:layout_width="0dp"
                android:layout_weight="5">
                <FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                </FrameLayout>
            </LinearLayout>

        </LinearLayout>
    </LinearLayout>

</RelativeLayout>

這个是全部代码了，注意一点一般是设置android:weight属性的时候才使用，，如果你的布局是按水平布局，设置控件比例，就设置ndroid:layout_width=“0dp”然后就可以自己按照你所设置的比例进行显示，如果是竖直布局的话，设置控件比例，android:layout_height=“0dp”就OK了图片