将textviews与第一个字符对齐

时间:2014-07-29 18:55:07

标签: android android-layout

我有一个自定义列表视图,如下所示:

<image><textview1>         <textview2>

这是XML文件:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/leader_item"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
    android:paddingTop="5dp"
    android:paddingBottom="5dp"
    android:orientation="horizontal"
    android:weightSum="2" >

<!-- heart icon and username -->
<RelativeLayout
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:layout_marginLeft="20dp"
    android:paddingLeft="10dp"
    android:gravity="center"
    android:layout_marginRight="5dp" >


    <ImageView
        android:id="@+id/leader_heart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:src="@drawable/tt_heart_icon"
        />

    <TextView
        android:id="@+id/leader_username"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="4dp"
        android:layout_toRightOf="@id/leader_heart"
        android:gravity="center"
        android:textColor="@color/light_blue"
        android:textSize="14sp"/>

</RelativeLayout>

<!-- like total -->
<TextView
    android:id="@+id/leader_like_total"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:layout_marginRight="20dp"
    android:gravity="center"
    android:textColor="@color/dark_grey"
    android:textSize="15sp"/>

</LinearLayout>

现在文本看起来像这样:

 <img><texthere>           <text>
   <img><text>             <text>
<img><biggertexthere>      <text>

无论如何重新安排左栏,以便文本视图与他们的第一个字符对齐,但仍然在父母的中心?即:

<img><texthere>           <text>
<img><text>               <text>
<img><biggertexthere>     <text>

编辑:

这就是我想要实现的目标:

    <header1>           <header2>
 <img><texthere>        <othertext>
 <img><text>            <othertext>
 <img><textherhehr>     <othertext>

2 个答案:

答案 0 :(得分:0)

我认为您可能需要在XML文件中切换一行。而不是居中图像,将其与父视图的左边缘对齐。

    <ImageView
        android:id="@+id/leader_heart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:src="@drawable/tt_heart_icon"
        />

*关于你的编辑:(和评论中的问题)

澄清:

- 您想让您的商品保持对齐,并以群组为中心

- 您希望标题也位于它们上方,但不要与(图像/文本)项目保持对齐

这是xml的样子(我想):

    <LinearLayout
        android:orientation="vertical"
        android:gravity="center"
        >

        <TextView/><!-- header -->

        <LinearLayout
            android:gravity="left"
            >

            <RelativeLayout>
                <ImageView/><TextView/>
            </RelativeLayout>

            <RelativeLayout>
                <ImageView/><TextView/>
            </RelativeLayout>

            <!--   ..    -->    

        </LinearLayout> 
    </LinearLayout> 

所以你的外层将包含两个视图,每个视图都是独立居中的

如果有任何建议,我每隔一段时间就要重新访问这个stackoverflow问题,以帮助我记住重力是如何工作的

Gravity and layout_gravity on Android

希望我的例子有用!

*编辑2

您可以通过编程方式实现上面使用的XML示例:

    rl_outer = new LinearLayout(context);
    r_inner = new RelativeLayout(context);

    rl_outer.setLayoutParams(new LayoutParams(
        LayoutParams.MATCH_PARENT,
        LayoutParams.MATCH_PARENT));
    r_outer.setGravity(Gravity.CENTER)

    RelativeLayout.LayoutParams rl_ingame_layoutparams = new            RelativeLayout.LayoutParams(
        LayoutParams.MATCH_PARENT,
        LayoutParams.MATCH_PARENT));
    rl_inner_layoutparams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);

   //then add your custom Listview to rl_inner

   rl_outer.addView(rl_inner,rl_inner_layoutparams);

   setContentView(rl_outer);

这样的事情应该允许你通过自定义列表视图实现我上面提到的两个布局标准。

答案 1 :(得分:0)

您可以使用drawableLeft删除内部RelativeLayout,您需要使用center_vertical而不是center来保持文本左对齐:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/leader_item"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
    android:orientation="horizontal"
    android:paddingBottom="5dp"
    android:paddingTop="5dp"
    android:weightSum="2">

    <!-- heart icon and username -->
    <TextView
        android:id="@+id/leader_username"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:drawableLeft="@drawable/tt_heart_icon"
        android:drawablePadding="4dp"
        android:gravity="center_vertical"
        android:textColor="@color/light_blue"
        android:textSize="14sp"/>

    <!-- like total -->
    <TextView
        android:id="@+id/leader_like_total"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginRight="20dp"
        android:gravity="center_vertical"
        android:textColor="@color/dark_grey"
        android:textSize="15sp"/>

</LinearLayout>

修改 现在我得到了你想要的东西。一种解决方案是为每列设置固定宽度(即本示例中为100dp)并将其居中设置如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/leader_item"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:paddingBottom="5dp"
    android:paddingTop="5dp"
    android:weightSum="2">

    <!-- heart icon and username -->
    <FrameLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_gravity="center_vertical">

        <TextView
            android:id="@+id/leader_username"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:drawableLeft="@drawable/tt_heart_icon"
            android:drawablePadding="4dp"
            android:gravity="center_vertical"
            android:textColor="@color/light_blue"
            android:textSize="14sp"/>

    </FrameLayout>

    <!-- like total -->
    <FrameLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_gravity="center_vertical">

        <TextView
            android:id="@+id/leader_like_total"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:gravity="center_vertical"
            android:textColor="@color/dark_grey"
            android:textSize="15sp"/>
    </FrameLayout>

</LinearLayout>