एंड्रॉइड XML ड्रॉबल फ़ाइल में एक सर्कल आकार कैसे परिभाषित करें?

687

मुझे एंड्रॉइड के लिए एक्सएमएल में आकृतियों की परिभाषाओं के प्रलेखन को खोजने में कुछ समस्याएं हैं। मैं एक XML फ़ाइल में एक ठोस रंग से भरे एक साधारण सर्कल को परिभाषित करना चाहूंगा ताकि इसे मेरी लेआउट फ़ाइलों में शामिल किया जा सके।

अफसोस की बात है कि android.com पर प्रलेखन आकार वर्गों के XML विशेषताओं को कवर नहीं करता है। मुझे लगता है कि मुझे एक सर्कल बनाने के लिए एक आर्कशैप का उपयोग करना चाहिए, लेकिन एक आर्क से सर्कल बनाने के लिए आकार, रंग या कोण को सेट करने के तरीके पर कोई स्पष्टीकरण नहीं है।

android android-drawable shapes

— Janusz
स्रोत

3

यहाँ आप आकृति को कैसे बनाने योग्य है, इसके बारे में पढ़ सकते हैं: developer.android.com/guide/topics/resources/…

— मारियो कुटलेव

आप सर्कल xml को यहाँ से प्राप्त कर सकते हैं। developer.android.com/samples/WearSpeakerSample/res/drawable/…

— Shahab Rauf

तब से Android देव प्रलेखन में सुधार किया गया है। अब इसमें android:shapeएलिमेंट - ड्रॉएबल रिसोर्स शामिल हैं ।

— 15

1514

यह एंड्रॉइड में एक ड्रॉबल के रूप में एक सरल सर्कल है।

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

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

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

— Arefin
स्रोत

51

और गतिशील रूप से रंग कैसे बदलना है?

— अंकित गर्ग

5

@AnkitGarg आप जावा कोड से एक रंगीन फ़िल्टर लागू कर सकते हैं (

— ड्रा करने योग्य

7

मैंने कोशिश की dpऔर यह एक अंडाकार आकार में विकृत हो गया। मेरे लिए, ptइसके बजाय का उपयोग कर इसे तय किया।

— टायलर

13

यदि आप बाद में दृश्य के लिए एक चौकोर आकार को परिभाषित करते हैं size, shapeतो इसमें कोई ज़रूरत नहीं है ।

— फेरन मेनलिंच

2

इसका आकार अंडाकार है और गोल नहीं है। क्या कोई पुष्टि कर सकता है ??

— तरुण

762

इसे अपनी दृश्य पृष्ठभूमि के रूप में सेट करें

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <stroke
        android:width="1dp"
        android:color="#78d9ff"/>
</shape>

ठोस सर्कल उपयोग के लिए:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid
        android:color="#48b3ff"/>
</shape>

स्ट्रोक के साथ ठोस:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#199fff"/>
    <stroke
        android:width="2dp"
        android:color="#444444"/>
</shape>

नोट : बनाने के लिए ovalया तो अपने विचार है कि आप अपनी पृष्ठभूमि के रूप में इस आकार का उपयोग कर रहे एक वर्ग होना चाहिए आकार इन उदाहरणों में, एक चक्र के रूप में दिखाई, या आप स्थापित करने के लिए heightऔर widthएक समान मूल्य को आकार टैग के गुणों।

— एम। रज़ा नासिरलो
स्रोत

2

अच्छा समाधान। बेशक, अंडाकार एक चक्र के रूप में दिखाई देता है यदि दृश्य की चौड़ाई और ऊंचाई समान है। मुझे लगता है कि इसे एक सर्कल के रूप में पेश करने का एक तरीका था, जो दृश्य के आकार से कोई फर्क नहीं पड़ता था।

— फेरन मायलिनच

2

@FerranMaylinch "मुझे लगता है कि इसे देखने के आकार के रूप में एक सर्कल के रूप में प्रकट करने का एक तरीका था।" मैंने इसे एक RelativeLayout का उपयोग करके हल किया, जिसमें एक ImageView (सर्कल के साथ "src" ड्राबल के रूप में) निश्चित चौड़ाई / ऊँचाई के साथ और एक TextView जो पाठ (उदाहरण के लिए) लपेटता है।

— मिशेल

मैं ठीक वैसा ही कर रहा हूं, लेकिन चक्र अंडाकार के रूप में तैयार किया गया है

— बग्स हैपन

क्या होगा अगर हमें रन टाइम के दौरान अलग-अलग बॉर्डर रंगों के साथ एक टेक्स्टव्यू बनाने की जरूरत पड़े?

— अंशुल त्यागी

@AnshulTyagi मेरा मानना है कि आप yourView.getBackground()रंग को मैन्युअल रूप से कॉल और सेट करके ऐसा कर सकते हैं । आपको इसे एक उचित प्रकार की तरह डालना होगा ShapeDrawable। इस बारे में SO पर संबंधित प्रश्न हैं।

— एम। रज़ा नसीरलो

93

सरल सर्कल के लिए कोड

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
        <solid android:color="#9F2200"/>
        <stroke android:width="2dp" android:color="#fff" />
        <size android:width="80dp" android:height="80dp"/>
</shape>

— रवि मकवाना
स्रोत

46

Android एसडीके के नमूनों में देखें। ApiDemos परियोजना में कई उदाहरण हैं:

/ ApiDemos / res / drawable /

black_box.xml
shape_5.xml
आदि

यह एक ग्रेडिएंट फिल के साथ एक सर्कल के लिए कुछ इस तरह दिखेगा:

<? xml संस्करण = "1.0" एन्कोडिंग = "utf-8"?>
<आकार xmlns: android = "http://schemas.android.com/apk/res/android" Android: आकार = "अंडाकार">
    <gradient android: startColor = "# FFFF0000" Android: endColor = "# 80FF00FF"
            एंड्रॉयड: कोण = "270" />
</ आकार>

— goosemanjack
स्रोत

46

आप नीचे दिए गए वेक्टरड्राइव का उपयोग कर सकते हैं :

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="200dp"
    android:height="200dp"
    android:viewportHeight="64"
    android:viewportWidth="64">

    <path
        android:fillColor="#ff00ff"
        android:pathData="M22,32
        A10,10 0 1,1 42,32
        A10,10 0 1,1 22,32 Z" />
</vector>

उपरोक्त एक्सएमएल निम्नानुसार प्रस्तुत करता है:

— रियास पीके
स्रोत

अरे, मैं सर्कल और व्यूपोर्ट के बीच पैडिंग कर रहा हूं। क्या तुम मेरी मदद कर सकते हो?

— अजीत

1

@Ajeet आप व्यूपोर्ट का आकार बदल सकते हैं और आप समूह के अंदर अपना रास्ता डाल सकते हैं और अनुवाद और पैमाना निर्दिष्ट कर सकते हैं<group android:translateX="-10" android:translateY="15"><path ...

— बोरिस ट्रेखोव

2

@ क्या आप पाथटा भाग को समझा सकते हैं? उन सह-निर्देशकों का क्या मतलब है?

— दर्शन मिशिन

22

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

    <!-- fill color -->
    <solid android:color="@color/white" />

    <!-- radius -->
    <stroke
        android:width="1dp"
        android:color="@color/white" />

    <!-- corners -->
    <corners
        android:radius="2dp"/>
</shape>

— Ashana.Jackol
स्रोत

1

<corners />एक अंडाकार में क्या करते हैं (जो मेरी सोच के कोने नहीं हैं)?

— स्कॉट बिग्स

17

पूर्व सामग्री के लिए यहां एक सरल वृत्त_बैकग्राउंड। Xml है:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="oval">
            <solid android:color="@color/color_accent_dark" />
        </shape>
    </item>
    <item>
        <shape android:shape="oval">
            <solid android:color="@color/color_accent" />
        </shape>
    </item>
</selector>

आप 'android:background="@drawable/circle_background"अपने बटन की लेआउट परिभाषा में विशेषता के साथ उपयोग कर सकते हैं

— kip2
स्रोत

+ आकार में 'आकार' जोड़ें (usecase पर निर्भर करता है)।

— टचबर्डर

17

अगर आप इस तरह का एक सर्कल चाहते हैं

नीचे दिए गए कोड का उपयोग करके देखें:

<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/white" />
    <stroke
        android:width="1dp"
        android:color="@android:color/darker_gray" />
</shape>

— पारस्केव्स नटसूनोस
स्रोत

8

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

    <stroke
        android:width="10dp"
        android:color="@color/white"/>

    <gradient
        android:startColor="@color/red"
        android:centerColor="@color/red"
        android:endColor="@color/red"
        android:angle="270"/>

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

— TeeTracker
स्रोत

7

रेस / drawble / circle_shape.xml

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

        <shape android:shape="oval">
            <solid android:color="#e42828"/>
            <stroke android:color="#3b91d7" android:width="5dp"/>
            <!-- Set the same value for both width and height to get a circular shape -->
            <size android:width="250dp" android:height="250dp"/>
        </shape>
    </item>
</selector>

— Tienanhvn
स्रोत

4

आप यह कोशिश कर सकते हैं -

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:innerRadiusRatio="700"
    android:thickness="100dp"
    android:useLevel="false">

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

</shape>

साथ ही, आप सर्कल के त्रिज्या को समायोजित करके समायोजित कर सकते हैं android:thickness।

— krhitesh
स्रोत

यह वास्तव में अच्छा है! यह निश्चित रूप से कुछ खेल लेता है क्योंकि विशेषताएँ सहज नहीं हैं। मैं हर बार सीमा के लिए एक अच्छा खाली सर्कल प्रदर्शित करने में कामयाब रहा। और आप यह सुनिश्चित करने के लिए कि पूरे वृत्त को प्रदर्शित करता है पैडिंग का उपयोग कर सकते हैं।

— स्कॉट बिग्स

2

मैं किसी कारण से अपने कॉन्स्ट्रेन्डलैट के अंदर एक वृत्त नहीं बना सका, मैं ऊपर दिए गए किसी भी उत्तर का उपयोग नहीं कर सका।

जब आपने "Alt + 7" दबाया है, तो पाठ के साथ पूरी तरह से काम करना एक सरल TextView है।

 <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#0075bc"
            android:textSize="40dp"
            android:text="•"></TextView>

— Иво Недев
स्रोत

बहुत चालाक! मुझे यकीन है कि किसी को यह उपयोगी लगेगा।

— स्कॉट बिग्स

बहुत उपयोगी, महान ..

— महबूबुर रहमान खान

1

आप इसका उपयोग करने का प्रयास कर सकते हैं

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

<item>
    <shape
        android:innerRadius="0dp"
        android:shape="ring"
        android:thicknessRatio="2"
        android:useLevel="false" >
        <solid android:color="@color/button_blue_two" />
    </shape>
</item>

और यदि आप इसका उपयोग किसी टेक्स्टव्यू के लिए कर रहे हैं तो आपको चौड़ाई और ऊंचाई के अनुपात को परेशान नहीं करना है

— साइरिल डेविड
स्रोत

0

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="@color/text_color_green"/>
            <!-- Set the same value for both width and height to get a circular shape -->
            <size android:width="250dp" android:height="250dp"/>
        </shape>
    </item>
</selector>

— वरुण सेतिया
स्रोत

0

एंड्रॉइड XML ड्रॉबल फ़ाइल में एक सर्कल आकार

<?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/white" />
    <stroke
        android:width="1.5dp"
        android:color="@android:color/holo_red_light" />
    <size
        android:width="120dp"
        android:height="120dp" />
</shape>

स्क्रीनशॉट

— आफताब आलम
स्रोत

-23

महज प्रयोग करें

ShapeDrawable circle = new ShapeDrawable( new  OvalShape() );

26

और मैं अपनी XML लेआउट फ़ाइल में ImageView के src के रूप में कैसे सेट कर सकता हूं?

— Janusz

यह सीधे xml लेआउट कोड के लिए लागू नहीं है

— फ्रांस्वा लेग्रैंड

1

यह वास्तव में काम करता है। धन्यवाद :) वैल बैकग्राउंड = शेपड्रावेबल (ओवलशैप ()) बैकग्राउंड.पेंट.कोलर = कॉन्टेक्स्ट कॉमपॉट.गेटकॉर्नर (होल्डर.गेट व्यू) (रिफरेंस, R.color.green) वैल लेयर्स = बैक (बैकग्राउंड, रिसोर्स !!) greenRoundIcon.setImageDrawable (लेयरवार्डेबल (परत))

— डेविड

इसलिए नापसंद, लेकिन यह काम करता है और यह मेरी मदद करता है, धन्यवाद

— पावेल शोरोखोव