सीमा के साथ पारदर्शी सर्कल


83

मैं Android में XML का उपयोग करके केवल एक बॉर्डर वाला एक सर्कल बनाने का प्रयास कर रहा हूं:

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

<stroke android:width="1dp"
    android:color="#000000"/>

</shape>

मेरे द्वारा उपयोग किया गया कोड ऊपर पोस्ट किया गया है। हालांकि, मुझे एक ठोस डिस्क मिलती है और एक अंगूठी नहीं है। मैं सिर्फ एक्सएमएल का उपयोग करके आउटपुट प्राप्त करना चाहता हूं न कि कैनवास। मैं क्या गलत कर रहा हूं?

धन्यवाद।

संपादित करें: यह नीचे दिए गए जवाब के लिए धन्यवाद काम करने के लिए मिला। मेरा अंतिम कोड:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="1.9"
    android:useLevel="false" >

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

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

    <stroke android:width="1dp"
    android:color="#FFFFFF"/>

</shape>

जवाबों:


188

कुछ इस तरह की कोशिश करो

<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="@android:color/transparent" />

    <stroke
        android:width="2dp"
        android:color="@android:color/darker_gray" />
</shape>

अद्यतन: android:thicknessRatio="2"पूर्ण सर्कल देने के लिए बनाया गया (Nexus 5 - लॉलीपॉप का उपयोग करके)


7
मैंने इसे android:thicknessRatio="2"एक बंद रिंग (नेक्सस 5, लॉलीपॉप) बनाया
डेविड

सर्कल के बाहर का क्षेत्र मेरे लिए उतना पारदर्शी नहीं दिख रहा है।
विरोधाभास

@ पाराडॉक्स बटन के बजाय इमेजव्यू की कोशिश करें
निकुंज पटेल

33

इस का उपयोग करें यह काम करेगा

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

<gradient
    android:centerX=".6"
    android:centerY=".40"
    android:endColor="@android:color/transparent"
    android:gradientRadius="20"
    android:startColor="@android:color/transparent"
    android:type="radial" />

<stroke
    android:width="1dp"
    android:color="#FFFFFF" />

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

</shape>

13

खोखले

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

पूर्ण

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

6

स्ट्रोक के प्रभाव को एक आवश्यक रंग के स्ट्रोक (उदाहरण में # 000) के साथ एक पारदर्शी अंडाकार प्राप्त किया जा सकता है:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@android:color/transparent" />
    <stroke
        android:width="1dp"
        android:color="#000" />
    <size
        android:width="40dp"
        android:height="40dp" />
</shape>

3

यदि आप वेक्टर आरेख का उपयोग कर सकते हैं तो यह प्रयास करें

<vector android:height="24dp" android:viewportHeight="512.0"
    android:viewportWidth="512.0" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="#FFFFFF" android:fillType="evenOdd"
        android:pathData="M0,0L512,0L512,512L0,512L0,0ZM256,511C396.8,511 511,396.8 511,256C511,115.2 396.8,1 256,1C115.2,1 1,115.2 1,256C1,396.8 115.2,511 256,511Z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
</vector>

2

आप के रूप में @android:color/transparentउपयोग #0000या के लिए पारदर्शी के लिए Android इनबिल्ट मूल्य का उपयोग कर सकते हैं#00000000

ऊपर 4 अंकों के लिए शुरू करने के लिए पहले अल्फा के लिए था और 8 अंकों के मूल्य में पहले दो अंक अल्फा के लिए समान था।

जब आप डिफ़ॉल्ट अल्फा वैल्यू की तुलना में सिर्फ 3 अंक या 6 अंक रंग में देते हैं, तो आप 4 अंकों या 8 अंकों के मूल्य में उत्तीर्ण होकर उस रंग मान के अल्फा को निर्धारित करते हैं।


1
हाय प्रतीक, मैंने आपके उत्तर के अल्फा भाग को नहीं समझा। मैंने XML फ़ाइल में लाइन <ठोस एंड्रॉइड: रंग = "# 0000" /> जोड़ दिया। लेकिन फिर भी वही परिणाम मिला।
अनिरुद्ध

इस अल्फा का उपयोग रंग की अस्पष्टता को निर्धारित करने के लिए किया गया था। यदि आप 4 0 या 8 0 को पूरी तरह से पारदर्शी सेट करते हैं, तो 8 0 में पहले 2 अंक की वृद्धि के साथ ही केवल अपारदर्शिता के मूल्य में वृद्धि होती है
प्रतिक

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

        <gradient
            android:endColor="@android:color/transparent"
            android:gradientRadius="20"
            android:startColor="@android:color/transparent" />

        <stroke
            android:width="1dp"
            android:color="#d9d9d9" />

        <size
            android:height="100dp"
            android:width="100dp" />
        </shape>
    </item>

    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="1dp">
        <shape android:shape="oval" >

            <gradient
                android:endColor="@android:color/transparent"
                android:gradientRadius="20"
                android:startColor="@android:color/transparent" />

            <stroke
                android:width="1dp"
                android:color="#b3b3b3" />

            <size
                android:height="100dp"
                android:width="100dp" />
        </shape>
    </item>
</layer-list>

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

            <stroke
                android:width="4dp"
                android:color="@color/colorPrimaryDark" />
            <corners android:radius="0dp" />
        </shape>
    </item>
    <item
        android:top="1dp"
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp">

        <shape android:shape="oval">
            <solid android:color="@color/colorRed" />
            <size android:height="@dimen/_100sdp"
                android:width="@dimen/_100sdp"></size>
        </shape>

    </item>

</layer-list>

0

यदि आप रंग सेट करते हैं #00000000, तो परिणाम पारदर्शी होगा। आप इसे इस तरह से करना चाहते हैं यदि आप इसे विकास के भविष्य में बदलना चाहते हैं। यदि आप चाहते हैं कि यह उदाहरण के लिए लाल और आंशिक रूप से पारदर्शी हो, तो यह #ff000088अंतिम दो संख्याओं की अस्पष्टता होगी। मैं इसे भविष्य के परिवर्तनों को आसान बनाने के लिए इसे करता हूँ।


0
<shape xmlns:android="http://schemas.android.com/apk/res/android"
     android:innerRadiusRatio="2"
     android:shape="ring"
     android:thicknessRatio="1"
     android:useLevel="false">

    <gradient
        android:type="radial"
        android:gradientRadius="8dp"
        android:endColor="@color/colorDarkPurple"
        android:elevation="5dp"
    />

    <stroke
        android:width="2dp"
        android:color="@color/colorLilac"/>
</shape>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.