android将imageview和文本垂直对齐到布局的中心

时间:2017-05-30 13:04:22

标签: android xml android-layout

我有一个带有imageview的xml布局和一个linearlayout中的文本。在显示视图时,图像视图和文本显示在垂直布局上,但在屏幕左侧显示,文本视图的某些文本被截断。这是片段

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:background="@drawable/grid_color_selector"
    android:orientation="vertical"
    android:padding="5dp">
     <!--view active Mechanics-->
    <ImageView
        android:id="@+id/imageCon"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/imgcon_2" />

    <TextView
        android:id="@+id/text1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:text="Active Mechanics"
        android:textSize="12sp" />

        <!--view scheduled Mechanics-->
    <ImageView
        android:id="@+id/imageCon2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/imgcon_1" />

    <TextView
        android:id="@+id/text2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:text="Scheduled Mechanics"
        android:textSize="12sp" />

    <!--view completed Mechanics-->
    <ImageView
        android:id="@+id/imageCon3"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/imgcon_3" />

    <TextView
        android:id="@+id/text3"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:text="Completed Mechanics"
        android:textSize="12sp" />

</LinearLayout>

请问如何在xml布局的垂直中心勾勒出上述内容。

2 个答案:

答案 0 :(得分:1)

您必须将LinearLayout的宽度更改为match_parent,并将android:layout_gravity添加到所有ImageView's的中心位置。试试这段代码:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:background="@drawable/grid_color_selector"
    android:orientation="vertical"
    android:padding="5dp">
    <!--view active Mechanics-->
    <ImageView
        android:layout_gravity="center"
        android:id="@+id/imageCon"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/imgcon_2" />

    <TextView
        android:id="@+id/text1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:text="Active Mechanics"
        android:textSize="12sp" />

    <!--view scheduled Mechanics-->
    <ImageView
        android:layout_gravity="center"
        android:id="@+id/imageCon2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/imgcon_1" />

    <TextView
        android:id="@+id/text2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:text="Scheduled Mechanics"
        android:textSize="12sp" />

    <!--view completed Mechanics-->
    <ImageView
        android:layout_gravity="center"
        android:id="@+id/imageCon3"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/imgcon_3" />

    <TextView
        android:id="@+id/text3"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:text="Completed Mechanics"
        android:textSize="12sp" />

</LinearLayout>

答案 1 :(得分:1)

您必须在根布局中添加两个属性,在本例中为LinearLayout。

  

机器人:layout_width = “match_parent”

     

机器人:比重= “中心”

示例:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="5dp"
          android:background="@drawable/grid_color_selector"
          android:orientation="vertical"
          android:gravity="center"
          android:padding="5dp">
<!--view active Mechanics-->
<ImageView
    android:id="@+id/imageCon"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:src="@drawable/imgcon_2" />

<TextView
    android:id="@+id/text1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:gravity="center"
    android:text="Active Mechanics"
    android:textSize="12sp" />

<!--view scheduled Mechanics-->
<ImageView
    android:id="@+id/imageCon2"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:src="@drawable/imgcon_1" />

<TextView
    android:id="@+id/text2"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:gravity="center"
    android:text="Scheduled Mechanics"
    android:textSize="12sp" />

<!--view completed Mechanics-->
<ImageView
    android:id="@+id/imageCon3"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:src="@drawable/imgcon_3" />

<TextView
    android:id="@+id/text3"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:gravity="center"
    android:text="Completed Mechanics"
    android:textSize="12sp" />

结果:

Preview