如何在xml文件中显示文本旁边的图标?

时间:2023-01-03 21:12:36

I tried to code like this

我试着这样编码

    <ImageView android:id="@+id/ivIcon"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:src="@android:drawable/ic_btn_speak_now" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item0" />

But it outputs like this. It's not in the same line :(

但输出是这样的。这是不一样的:

如何在xml文件中显示文本旁边的图标?

My whole xml code is just like this. (icon) item will be a set, which will be clicked by a user to move on activity.
So I need grouping them together.

我的整个xml代码就像这样。(图标)项目将是一个集合,用户点击该集合就可以继续活动。所以我需要把它们放在一起。

<LinearLayout style="@style/behindMenuScrollContent"
    android:paddingTop="25dp" >

    <TextView
        style="@style/behindMenuItemTitle"
        android:text="Subject" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item0" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item1" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item2" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item3" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item4" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item5" />

    <TextView
        style="@style/behindMenuItemTitle"
        android:text="Subject2" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item6" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item7" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item8" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item9" />

    <TextView
        style="@style/behindMenuItemLabel"
        android:text="Item10" />


    <Button
        android:id="@+id/behind_btn"
        style="@style/behindMenuItemLabel"
        android:text="BUTTON" />

</LinearLayout>

UPDATE: I don't need margin between icon and text but need margin only on left!

更新:我不需要页边距图标和文字,但只需要页边距左边!

如何在xml文件中显示文本旁边的图标?

style.xml

style.xml

<style name="behindMenuItemLabel">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:layout_marginLeft">20dp</item>
    <item name="android:layout_marginBottom">4dp</item>
    <item name="android:textSize">30sp</item>
    <item name="android:textColor">#d2d2d2</item>
</style>

5 个解决方案

#1


4  

Try something like this :

试试这样的方法:

<TextView
    android:id="@+id/behindMenuItemLabel"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="30dp"
    android:layout_weight="40"
    android:drawablePadding="-5dp"
    android:gravity="center_vertical"
    android:text="Speak Now"
    android:textColor="#000000"
    style="@style/behindMenuItemLabel" />

And this is your style.xml

这是样式。xml

<style name="behindMenuItemLabel">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:layout_marginLeft">20dp</item>
    <item name="android:layout_marginBottom">4dp</item>
    <item name="android:textSize">30sp</item>
    <item name="android:drawableLeft">@drawable/your_icon</item>
    <item name="android:textColor">#d2d2d2</item>
</style>

#2


4  

your need be full filled using the drawable attribute of textview, below i am giving one example:

使用textview的drawable属性来填充您的需要,下面我举一个例子:

<TextView
        android:id="@+id/bookTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center_horizontal"
        android:drawableBottom="@drawable/icon"
        android:text="Item 0"
        style="@style/behindMenuItemLabel"/>

Hope it helps

希望它能帮助

#3


3  

you can set icon at all four side of a text in TextView

你可以在TextView中设置文本的四个面

Right :

正确的:

android:drawableRight="@drawable/icon"

Top :

上图:

android:drawableTop="@drawable/icon"

Bottom :

底:

android:drawableBottom="@drawable/icon"

Left :

左:

android:drawableLeft="@drawable/icon"

android:drawableLeft = " @drawable /图标”

#4


2  

Do not use separate imageView for icon. In your textview set the drawable in right (or left,top,bottom)

不要为图标使用单独的imageView。在textview中,将drawable设置为右(或左、上、下)

 android:drawableRight="@android:drawable/ic_btn_speak_now"

#5


1  

You can use this attr android:drawableLeft="your_drawable_id" to set image left of text so the xml tag will be like this :

您可以使用这个attr android:drawableLeft="your_drawable_id"来设置文本左侧的图像,因此xml标记将如下所示:

<TextView
    android:id="@+id/bookTitle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center_horizontal"
    android:drawableLeft="@drawable/icon"
    android:text="Item 0"
    style="@style/behindMenuItemLabel"/>

You can also set image right,top or bottom. Best wishes.

你也可以设置图像的右、上或下。最好的祝福。

#1


4  

Try something like this :

试试这样的方法:

<TextView
    android:id="@+id/behindMenuItemLabel"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="30dp"
    android:layout_weight="40"
    android:drawablePadding="-5dp"
    android:gravity="center_vertical"
    android:text="Speak Now"
    android:textColor="#000000"
    style="@style/behindMenuItemLabel" />

And this is your style.xml

这是样式。xml

<style name="behindMenuItemLabel">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:layout_marginLeft">20dp</item>
    <item name="android:layout_marginBottom">4dp</item>
    <item name="android:textSize">30sp</item>
    <item name="android:drawableLeft">@drawable/your_icon</item>
    <item name="android:textColor">#d2d2d2</item>
</style>

#2


4  

your need be full filled using the drawable attribute of textview, below i am giving one example:

使用textview的drawable属性来填充您的需要,下面我举一个例子:

<TextView
        android:id="@+id/bookTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center_horizontal"
        android:drawableBottom="@drawable/icon"
        android:text="Item 0"
        style="@style/behindMenuItemLabel"/>

Hope it helps

希望它能帮助

#3


3  

you can set icon at all four side of a text in TextView

你可以在TextView中设置文本的四个面

Right :

正确的:

android:drawableRight="@drawable/icon"

Top :

上图:

android:drawableTop="@drawable/icon"

Bottom :

底:

android:drawableBottom="@drawable/icon"

Left :

左:

android:drawableLeft="@drawable/icon"

android:drawableLeft = " @drawable /图标”

#4


2  

Do not use separate imageView for icon. In your textview set the drawable in right (or left,top,bottom)

不要为图标使用单独的imageView。在textview中,将drawable设置为右(或左、上、下)

 android:drawableRight="@android:drawable/ic_btn_speak_now"

#5


1  

You can use this attr android:drawableLeft="your_drawable_id" to set image left of text so the xml tag will be like this :

您可以使用这个attr android:drawableLeft="your_drawable_id"来设置文本左侧的图像,因此xml标记将如下所示:

<TextView
    android:id="@+id/bookTitle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center_horizontal"
    android:drawableLeft="@drawable/icon"
    android:text="Item 0"
    style="@style/behindMenuItemLabel"/>

You can also set image right,top or bottom. Best wishes.

你也可以设置图像的右、上或下。最好的祝福。