android - 自定义设计文本框

Question

我想在文本框上方进行设计，但不知道如何做到这一点。

我在上面搜索了 png,svg 没有找到任何 .

请帮我提出任何建议？

标签： androidtextboxtextviewandroid-custom-view

Answer 1

解决方案：使用LayerDrawable来实现你的文本框设计。

什么是LayerDrawable简单的in？

LayerDrawable 是一个可绘制对象，用于管理一系列其他可绘制对象。列表中的每个可绘制对象都按照列表的顺序绘制——列表中的最后一个可绘制对象绘制在顶部。

每个可绘制对象由单个元素内的一个元素表示。

从您的文本框设计中，我将分为 4 个元素。

• 顶部中心水平箭头图标
• 矩形中的文本框内容
• 位图中的左上角图像
• 位图中的右上角

将所有内容放入background_text_box.xml文件中：

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

    <!-- The arrow in triangle by rotate a rectangle 45 degrees -->
    <item
        android:width="10dp"
        android:height="10dp"
        android:gravity="center_horizontal"
        android:top="0dp">
        <rotate android:fromDegrees="45">
            <shape android:shape="rectangle">
                <solid android:color="#FFF1A4" />
            </shape>
        </rotate>

    </item>

    <!-- The content in rectangle -->
    <item
        android:width="300dp"
        android:height="100dp"
        android:gravity="fill"
        android:top="5dp">
        <shape android:shape="rectangle">
            <solid android:color="#FFF1A4" />
        </shape>
    </item>

    <!-- The left corner image in bitmap-->
    <item
        android:gravity="top|left"
        android:top="5dp">
        <bitmap android:src="@drawable/icon" />
    </item>

    <!-- The right corner image in bitmap -->
    <item
        android:gravity="top|right"
        android:top="5dp">
        <bitmap android:src="@drawable/icon" />
    </item>

</layer-list>

结果如下所示：

让我们测试一下：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/spinner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingStart="50dp"
        android:paddingEnd="50dp"
        android:gravity="center"
        android:text="Congratulation...!\nLaxminarayan is top performaer\nof month December 2017"
        android:background="@drawable/background_text_box"/>
</LinearLayout>

文本框如下所示：