[英]How to draw a circle inside a circle using Android xml shapes?
我正試圖為我的應用程序制作一個搜索欄的拇指,我想要一個由不同的,更大的(半透明)外圈包圍的內圈。 我正在嘗試使用layer-list
,但我遇到了問題。 以下是我的代碼......
<?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="#00f" />
<size
android:height="15dp"
android:width="15dp" />
</shape>
</item>
<item>
<shape
android:shape="oval" >
<solid android:color="#f00" />
<size
android:height="10dp"
android:width="10dp" />
</shape>
</item>
</layer-list>
我希望在一個更大的藍色圓圈上面看到一個小紅圈,但我所看到的只是一個小紅圈。 有沒有人有任何想法?
我實現這一點的唯一方法是為內部(即頂部)圓定義一個透明筆划,它是較大和較小圓的大小之間的差異。
例如,這個:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Larger blue circle in back -->
<item>
<shape android:shape="oval">
<solid android:color="#00f"/>
<size
android:width="15dp"
android:height="15dp"/>
</shape>
</item>
<!-- Smaller red circle in front -->
<item>
<shape android:shape="oval">
<!-- transparent stroke = larger_circle_size - smaller_circle_size -->
<stroke android:color="@android:color/transparent"
android:width="5dp"/>
<solid android:color="#f00"/>
<size
android:width="10dp"
android:height="10dp"/>
</shape>
</item>
</layer-list>
......看起來像這樣:
希望它會有所幫助。 這是可繪制的* .xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="oval">
<padding
android:bottom="1dp"
android:left="1dip"
android:right="1dp"
android:top="1dp" />
<solid android:color="#000" />
</shape>
</item>
<item>
<shape android:shape="oval">
<padding
android:bottom="1dp"
android:left="1dip"
android:right="1dp"
android:top="1dp" />
<solid android:color="#EEE" />
</shape>
</item>
</layer-list>
它很晚但可能有用,你可以使用填充中心圓。
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="oval">
<solid
android:color="#00fff"/>
<padding
android:bottom="30dp"
android:left="30dp"
android:right="30dp"
android:top="30dp"/>
<stroke
android:width="1dp"
android:color="@color/holo_red_light"/>
</shape>
</item>
<item>
<shape
android:shape="oval">
<solid
android:color="#00666666"/>
<size
android:width="120dp"
android:height="120dp"/>
<stroke
android:width="1dp"
android:color="@color/holo_red_light"/>
</shape>
</item>
</layer-list>
我設法通過在<layer-list>
設置<item>
的寬度和高度來解決這個問題。 可能不是最佳實踐,但在列表視圖中具有固定尺寸的圖標背景似乎沒問題。
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- larger circle at the back -->
<item android:height="54dp" android:width="54dp" android:gravity="center">
<shape
android:shape="oval">
<solid
android:color="#0000FF"/>
<!-- thicker outer boarder -->
<stroke
android:width="2dp"
android:color="#000000"/>
</shape>
</item>
<!-- inner circle -->
<item android:height="40dp" android:width="40dp" android:gravity="center">
<shape
android:shape="oval" >
<solid
android:color="#00FF00"/>
<stroke
android:width="1dp"
android:color="#000000"/>
</shape>
</item>
</layer-list>
希望下面的代碼片段有幫助:)
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- larger circle at the back -->
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="ring"
android:thicknessRatio="2"
android:useLevel="false" >
<solid android:color="#FFFFFF" />
<stroke
android:width="1dp"
android:color="#000000" /></shape>
</item>
<!-- inner circle -->
<item >
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="ring"
android:thicknessRatio="2.1"
android:useLevel="false" >
<solid android:color="#000000" />
<stroke
android:width="1dp"
android:color="#FFFFFF" /></shape>
</item>
</layer-list>
這是Sean Barbeau答案的簡短版本
<stroke
android:width="1dp"
android:color="@color/white" />
<solid android:color="@color/dark_blue" />
<size
android:width="14dp"
android:height="14dp" />
只是你必須使用Shap
屬性
xml代碼可繪制
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
<stroke android:width="2dp" android:color="#B91969"/>
<size android:width="@dimen/dim_16dp" android:height="@dimen/dim_16dp" />
<solid android:color="#0f0" />
</shape>
產量
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.