Question

如何绘制附图像的形状。

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<stroke
    android:width="8dp"
    android:color="#00A79E"/>

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

使用9-Patch Image给我破碎的图像

Answer 1

您可以根据需要使用图层列表

来确定布局。

  var bodyHtml = '<p>Content</p>';
  var headHtml = '<title>Title</title>';

  var iframe = document.createElement('iframe');

  // inject the bodyHTML to locally iframe
  iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(bodyHtml );

  // headHtml how ?

  // inject my iframe in the DOM
  $('mySelector').append(iframe);

结果看起来像附图，

Answer 2

您可以使用layer-list

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

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="#e5e5e5" />
        </shape>
    </item>
    <item android:top="10dp" android:bottom="10dp" android:left="10dp" android:right="10dp">
    <shape android:shape="oval">
        <gradient android:angle="90" android:startColor="@color/colorPrimary"/>
        <stroke android:color="#ff00" android:width="10dp"/>
    </shape>
</item>

    <item
        android:bottom="40dp"
        android:drawable="@drawable/ic_launcher_round"
        android:left="40dp"
        android:right="40dp"
        android:top="40dp" />
</layer-list>

<强>输出

Answer 3

为此任务制作两个可绘制文件

首先是中风：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <stroke
        android:width="8dp"
        android:color="#00A79E" />



</shape>

纯色的第二个：

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


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

</shape>

将此drawable作为背景应用于layout.xml中，如此

<LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/test"
        android:padding="@dimen/diam15dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/test2"
            android:padding="@dimen/diam15dp"

            android:text="sdadasdad" />


    </LinearLayout>

根据您的需要更改填充。希望这会对你有帮助..

Answer 4

这Layer List Drawable正是你想要的。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- larger circle at the back -->
    <item android:gravity="center">
        <shape android:shape="oval">

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

            <stroke
                android:width="5dp"
                android:color="#349fab" />
        </shape>
    </item>

    <!-- inner circle -->
    <item
        android:bottom="10dp"
        android:gravity="center"
        android:left="10dp"
        android:right="10dp"
        android:top="10dp">
        <shape android:shape="oval">
            <solid android:color="#CCCCCC" />
        </shape>
    </item>
</layer-list>

圆形有2个笔画和渐变

4 个答案: