圆形图像上的文本

时间:2017-04-05 11:30:30

标签: android android-imageview android-image

我想在带有背景图像的圆形图像上放置一个大文本。

像这样:enter image description here

5 个答案:

答案 0 :(得分:5)

试试这个:
在drawable文件夹中创建xml文件:circular_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="oval">

   <solid android:color="#B72854" />
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />
   <size
        android:width="15dp"
        android:height="15dp" />
</shape>

然后在TextView背景中添加此行:

<TextView
    android:id="@+id/textview"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:text="FB"
    android:textColor="#fff"
    android:textSize="20sp"
    android:background="@drawable/circular_bg"
    android:gravity="center_vertical|center_horizontal"/>

它会帮助你。 :)

答案 1 :(得分:2)

使用Button并设置背景可绘外观的最佳方式。

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">

<solid android:color="@android:color/holo_red_dark" />

</shape>

设置此可绘制按钮背景并设置文本。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">

<Button
    android:id="@+id/button"
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:background="@drawable/button_background"
    android:text="FB"
    android:textColor="@android:color/white"
    android:textSize="35sp" />

</LinearLayout>

答案 2 :(得分:1)

你可以用两种方式来做,

如果您实际使用的是图形图像,请使用相对布局,并将图像视图和textview放置为它的子项。并确保使用centerInParent参数保留textview。

如果您不需要图形资源,则可以创建自定义可绘制对象,并将其设置为textview的背景。

自定义drawable可以是这样的:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="28dp" />
    <solid android:color="@color/THEME_GREEN_DARK" />
</shape>

然后您可以将其添加为textview的背景。另外,根据你需要的圆圈大小改变你的半径!

答案 3 :(得分:0)

有很多库可以做到这一点

将此添加到build.gradle

repositories{
    maven {
        url 'http://dl.bintray.com/amulyakhare/maven'
    }
}

dependencies {
    compile 'com.amulyakhare:com.amulyakhare.textdrawable:1.0.1'
}

<ImageView android:layout_width="60dp"
           android:layout_height="60dp"
           android:id="@+id/image_view"/>

注意:指定ImageView的宽度/高度,drawable将自动缩放以适合大小。

TextDrawable drawable = TextDrawable.builder()
                .buildRect("FB", Color.RED);

ImageView image = (ImageView) findViewById(R.id.image_view);
image.setImageDrawable(drawable);

答案 4 :(得分:0)

希望这会有所帮助。感谢

circular_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

<solid
android:color="#ff1e8f" />

<size
android:width="120dp"
android:height="120dp" />

<corners
android:bottomLeftRadius="65dp"
android:bottomRightRadius="65dp"
android:topLeftRadius="65dp"
android:topRightRadius="65dp" />

</shape>

layout.xml

<TextView
android:layout_width="120dp"
android:layout_height="120dp"
android:background="@drawable/circular_drawable"
android:gravity="center"
android:textColor="#FFFFFF"
android:text="FB"
android:textSize="26sp"
android:layout_centerInParent="true"/>