Android LinearLayout: LinearLayout के चारों ओर छाया के साथ सीमा जोड़ें

Question

मैं उदाहरण के रूप में इस LinearLayout की एक ही सीमा बनाना चाहते हैं:

इस उदाहरण में, हम देख सकते हैं कि रैखिक रेखा के चारों ओर सीमा समान नहीं है। मैं XML ड्रा करने योग्य फ़ाइल का उपयोग करके इसे कैसे बना सकता हूं?

अभी के लिए, मैं केवल इस तरह LinearLayout के चारों ओर एक साधारण सीमा बनाने में सक्षम है:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
  <corners
      android:radius="1dp"
      android:topRightRadius="0dp"
      android:bottomRightRadius="0dp"
      android:bottomLeftRadius="0dp" />
  <stroke
      android:width="1dp"
      android:color="#E3E3E1" />

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

</shape>

Comments

आप इसके लिए backgroundसंपत्ति का उपयोग कर सकते हैं ... आयत, रंग और छाया प्रभाव जैसी आकृति वाली एक XML फ़ाइल बनाएं और इसे अपने रेखीय लेआउट के लिए पृष्ठभूमि के रूप में सेट करें ..

— प्रज्ञानेश घोड़ा シ

ग्रे बॉर्डर और पैडिंग प्रभाव के लिए भी स्ट्रोक का उपयोग करें

— प्रज्ञानेश घोड़ा '

मुझे लगता है, कि इसकी दो लेआउट xml, एक रेखीय लेआउट है और आंतरिक गद्दी के सापेक्ष लेआउट है

— गिरु भाई

@ Prag और क्या आप इस xml फ़ाइल को बनाने के लिए मेरी मदद कर सकते हैं?

— वावनोपोलोस

एक वैकल्पिक तरीका आपके लेआउट के लिए पृष्ठभूमि के रूप में 9 पैच छवि का उपयोग कर सकता है। यह मेरी राय में एक बहुत चिकनी, लुप्त होती छाया (बहुत यथार्थवादी) के लिए अनुमति देगा।

— फैंटमैक्स

Answer 1

इसे इस्तेमाल करे..

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#CABBBBBB"/>
            <corners android:radius="2dp" />
        </shape>
    </item>

    <item
        android:left="0dp"
        android:right="0dp"
        android:top="0dp"
        android:bottom="2dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white"/>
            <corners android:radius="2dp" />
        </shape>
    </item>
</layer-list>

Comments

@ हरिहरन बहुत बहुत धन्यवाद! मैं अपने कोड की कोशिश की और यह ठीक लगता है। लेकिन, अभी तक एक बात है, मैं एक छोटी सी सीमा (1dp) बाईं ओर और रेखाचित्र के दाईं ओर कैसे जोड़ सकता हूं? (उदाहरण के रूप में)

— wananopoulos

@wawanopoulos बस की जगह "0dp"के साथ "1dp"हरिहरन के जवाब में।

— फैंटमैक्स

आप माता-पिता के लेआउट में #EAEA रंग जोड़ सकते हैं ताकि यह प्रश्न चित्र की तरह हो जाए

— Samad

मैं इसके लिए भी सुझाव दूंगा, आप सीमा प्रभाव को बढ़ाने के लिए <gradient>अपने में उपयोग कर सकते हैं <shape>, और यह भी कि अगर यह वास्तव में आपके यूआई की जरूरत है तो सिर्फ ठोस रंग सीमा के बजाय।

— patrickjason91

सुनिश्चित करें कि यदि आपके पास match_parent के साथ आंतरिक लेआउट है, तो मार्जिन 1 से आंतरिक लेआउट दें

— शक्तिसिंह जडेजा

Answer 2

इसलिए CardView मौजूद है। कार्ड व्यू | एंड्रॉइड डेवलपर्स
यह सिर्फ एक फ्रेम-आउट है जो प्री-लॉलीपॉप डिवाइस में उन्नयन का समर्थन करता है।

<android.support.v7.widget.CardView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:cardUseCompatPadding="true"
    app:cardElevation="4dp"
    app:cardCornerRadius="3dp" >

    <!-- put whatever you want -->

</android.support.v7.widget.CardView>

इसका उपयोग करने के लिए आपको निर्भरता जोड़ने की आवश्यकता है build.gradle:

compile 'com.android.support:cardview-v7:23.+'

Comments

छाया रंग कैसे बदल सकता है

— आदित्य कौशल

छाया बहुत कमजोर है stackoverflow.com/questions/49076188/…

— user924

4.4.4 (या समान) वाले उपकरणों में बहुत अजीब व्यवहार। इसमें एक बड़ा मार्जिन कार्डव्यू में जोड़ा गया है और UI को बहुत बदसूरत बनाता है।

— मोर्टेजा रस्तगो 13

यह स्वीकृत उत्तर होना चाहिए। हालांकि एक छोटा सा अपडेट। आपको androidx का उपयोग करना चाहिए -> androidx.cardview.widget.CardView

— bogdan

Answer 3

मुझे 9 पैच ग्राफ़िक का उपयोग करके सबसे अच्छे दिखने वाले परिणाम मिलते हैं।

आप निम्नलिखित संपादक का उपयोग करके केवल एक व्यक्तिगत 9 पैच ग्राफिक बना सकते हैं: http://inloop.github.io/shadow4andn/

उदाहरण:

9 पैच ग्राफिक:

परिणाम:

स्रोत:

<LinearLayout
android:layout_width="200dp"
android:layout_height="200dp"
android:orientation="vertical"
android:background="@drawable/my_nine_patch"

Comments

मैं काली रेखा को कैसे छिपा सकता हूं? कृपया मदद करें

— इसहाक डार्लोंग

@ आईसाॅक ने इमेज को my_nine_patch.9.png (.9.png 9 बैच इमेज के रूप में सहेजा)

— arun

यह सबसे अच्छा है!

— नुमानकमर

Answer 4

ठीक है, मुझे पता है कि यह बहुत देर हो चुकी है। लेकिन मैं एक ही आवश्यकता थी। मैंने इस तरह हल किया

1. फ़र्स्ट "ड्रॉबल" फोल्डर में एक xml फाइल (उदाहरण: border_shadow.xml) बनाएं और उसमें नीचे दिए गए कोड को कॉपी करें।

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

<item>
    <shape>
        <!-- set the shadow color here -->
        <stroke
            android:width="2dp"
            android:color="#7000" />

        <!-- setting the thickness of shadow (positive value will give shadow on that side) -->

        <padding
            android:bottom="2dp"
            android:left="2dp"
            android:right="-1dp"
            android:top="-1dp" />

        <corners android:radius="3dp" />
    </shape>
</item>

<!-- Background -->

<item>
    <shape>
        <solid android:color="#fff" />
        <corners android:radius="3dp" />
    </shape>
</item>

2. लेआउट पर जहां आप छाया चाहते हैं (उदाहरण: LinearLayout) इसे एंड्रॉइड में जोड़ें: पृष्ठभूमि

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dip"
    android:background="@drawable/border_shadow"
    android:orientation="vertical">

और वह मेरे लिए काम करता है।

Answer 5

यह बहुत आसान है:

इस तरह एक ढाल के साथ एक ड्रा करने योग्य फ़ाइल बनाएँ:

एक दृश्य के नीचे छाया के लिए below_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">   
<gradient
    android:startColor="#20000000"
    android:endColor="@android:color/transparent"
    android:angle="270" >
</gradient>
</shape>

एक दृश्य के ऊपर छाया के लिए above_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">   
<gradient
    android:startColor="#20000000"
    android:endColor="@android:color/transparent"
    android:angle="90" >
</gradient>
</shape>

और इसलिए दाएं और बाएं छाया के लिए ढाल के कोण को बदल दें :)

Comments

मैं नीचे_शादी के लिए कहां कहता हूं? एक दृश्य की पृष्ठभूमि?

— आर्थर मेलो

नीचे_शेडो xml फ़ाइल बनाएँ, फिर अपने विचार में, अपने लेआउट में एक "दृश्य" जोड़ें और नीचे_shadow.xml को इस दृश्य की पृष्ठभूमि के रूप में सेट करें

— मोर्टेज़ा रस्तगो

जैसा आपने बताया था मैंने वैसा ही किया, लेकिन जब मैंने उस दृश्य को कस्टम दृश्य में रखा तो मेरा "ऊपर_शादी" पारदर्शी नहीं है। यह अलग से ठीक काम करता है। मुझे क्या करना चाहिए?

— सोयुंग

Answer 6

एक विकल्प के रूप में, आप अपने लेआउट के लिए पृष्ठभूमि के रूप में 9 पैच छवि का उपयोग कर सकते हैं, अधिक "प्राकृतिक" छाया के लिए अनुमति देते हैं:

परिणाम:

छवि को अपने /res/drawableफ़ोल्डर में रखें।
सुनिश्चित करें कि फ़ाइल एक्सटेंशन है .9.png, नहीं.png

वैसे, यह एपीआई 19 sdk रिसोर्स फ़ोल्डर में पाए जाने वाले मौजूदा संसाधन का एक संशोधित (न्यूनतम वर्ग आकार में कम) है।
मैंने लाल मार्करों को छोड़ दिया, क्योंकि वे हानिकारक नहीं लगते हैं, जैसा कि draw9patch टूल में दिखाया गया है।

[संपादित करें]

लगभग 9 पैच, यदि आपके पास उनके साथ कुछ भी करने के लिए कभी नहीं था।

बस इसे अपने दृश्य की पृष्ठभूमि के रूप में जोड़ें।

काले-चिह्नित क्षेत्र (बाएं और ऊपर) खिंचाव (लंबवत, क्षैतिज रूप से) होंगे।
काले-चिह्नित क्षेत्र (दाएं, नीचे) "सामग्री क्षेत्र" को परिभाषित करते हैं (जहां पाठ या दृश्य जोड़ना संभव है - यदि आप चाहें तो आप अनमार्क किए गए क्षेत्रों को "पैडिंग" कह सकते हैं)।

ट्यूटोरियल: http://radleymarx.com/blog/simple-guide-to-9-patch/

Comments

बस इसे अपने दृश्य की पृष्ठभूमि के रूप में जोड़ें। काले-चिह्नित क्षेत्र (बाएं और ऊपर) खिंचाव (लंबवत, क्षैतिज रूप से) होंगे। काले-चिह्नित क्षेत्र (दाएं, नीचे) "सामग्री क्षेत्र" को परिभाषित करते हैं (जहां पाठ या दृश्य जोड़ना संभव है - इसे "पैडिंग" कहें, यदि आप चाहें तो)। ट्यूटोरियल: radleymarx.com/blog/simple-guide-to-9-patch

— Phantômaxx

Answer 7

आप एक फाइल बनाते हैं। नाम ड्रॉप_shadow.xml के साथ ड्रा करने योग्य .xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--<item android:state_pressed="true">
        <layer-list>
            <item android:left="4dp" android:top="4dp">
                <shape>
                    <solid android:color="#35000000" />
                    <corners android:radius="2dp"/>
                </shape>
            </item>
            ...
        </layer-list>
    </item>-->
    <item>
        <layer-list>
            <!-- SHADOW LAYER -->
            <!--<item android:top="4dp" android:left="4dp">
                <shape>
                    <solid android:color="#35000000" />
                    <corners android:radius="2dp" />
                </shape>
            </item>-->
            <!-- SHADOW LAYER -->
            <item>
                <shape>
                    <solid android:color="#35000000" />
                    <corners android:radius="2dp" />
                </shape>
            </item>
            <!-- CONTENT LAYER -->
            <item android:bottom="3dp" android:left="1dp" android:right="3dp" android:top="1dp">
                <shape>
                    <solid android:color="#ffffff" />
                    <corners android:radius="1dp" />
                </shape>
            </item>
        </layer-list>
    </item>
</selector>

फिर:

<LinearLayout
...
android:background="@drawable/drop_shadow"/>

Answer 8

इस एकल पंक्ति का उपयोग करें और उम्मीद है कि आप सबसे अच्छा परिणाम प्राप्त करेंगे;

उपयोग: android:elevation="3dp" अपनी जरूरत के अनुसार आकार को समायोजित करें और बटन और अन्य डिफ़ॉल्ट एंड्रॉइड छाया जैसी छाया को प्राप्त करने का यह सबसे अच्छा और सरल तरीका है। मुझे पता है अगर यह काम किया!

Comments

@ MichałZiobro अपने लेआउट के साथ इसका उपयोग करें जैसे कि आपके पास एक लेआउट है जो छोटा है और आप छाया दिखाना चाहते हैं। यह काम करना चाहिए। आपको लगता है कि आपके पाठ और बटन अदृश्य हो सकते हैं, लेकिन जब आप ऐप चलाएंगे तो आपको सबसे अच्छी छाया दिखाई देगी। मुझे यकीन नहीं है कि यह किसी प्रकार का बग या कुछ है, लेकिन मेरे मामले में जब मैं उस कोड का उपयोग करता हूं तो यह मेरे सभी दृश्यों को एएस पूर्वावलोकन में अदृश्य बनाता है, लेकिन जब मैं अपने डिवाइस में डिबग / लॉन्च करता हूं तो यह ऐप में सबसे अच्छा काम करता है। मुझे पता है कि यह काम किया या नहीं। धन्यवाद।

— तमीम

Answer 9

यदि आपके पास पहले से ही बॉर्डर शेप में है तो केवल ऊंचाई जोड़ें:

<LinearLayout
    android:id="@+id/layout"
    ...
    android:elevation="2dp"
    android:background="@drawable/rectangle" />

Comments

एपीआई <21 पर एक व्यवहार क्या है?

— CoolMind

दुर्भाग्य से यह प्री लॉलीपॉप काम नहीं करता है इसलिए आपको इस प्रश्न के कुछ अन्य उत्तरों का उपयोग करना चाहिए। लेकिन अगर आप नए फोन को लक्षित कर रहे हैं, तो यह एक बहुत आसान तरीका है जो इसे अच्छी तरह से काम करता है।

— क्रिजिनल

Answer 10

1.First "drawable" फ़ोल्डर में एक xml फ़ाइल नाम shadow.xml बनाएं और इसमें नीचे दिए गए कोड को कॉपी करें।

 <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape android:shape="rectangle">
                <solid android:color="#CABBBBBB" />
                <corners android:radius="10dp" />
            </shape>
        </item>

        <item
            android:bottom="6dp"
            android:left="0dp"
            android:right="6dp"
            android:top="0dp">
            <shape android:shape="rectangle">
                <solid android:color="@android:color/white" />
                <corners android:radius="4dp" />
            </shape>
        </item>
    </layer-list>

फिर अपने LinearLayout में लेयर-लिस्ट को बैकग्राउंड के रूप में जोड़ें।

<LinearLayout
        android:id="@+id/header_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shadow"
        android:orientation="vertical">

Comments

बहुत बहुत धन्यवाद सर, आपका कोड ठीक लगता है ...

— जॉन डाट

@ जोहदहाट ठीक है

— सुधीर सिंह

Answer 11

हां महदी अज्ज --- रिलेटिवलैट के लिए

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:startColor="#7d000000"
                android:endColor="@android:color/transparent"
                android:angle="90" >
            </gradient>
            <corners android:radius="2dp" />
        </shape>
    </item>

    <item
        android:left="0dp"
        android:right="3dp"
        android:top="0dp"
        android:bottom="3dp">
        <shape android:shape="rectangle">
            <padding
                android:bottom="40dp"
                android:top="40dp"
                android:right="10dp"
                android:left="10dp"
                >
            </padding>
            <solid android:color="@color/Whitetransparent"/>
            <corners android:radius="2dp" />
        </shape>
    </item>
</layer-list>

Answer 12

मुझे पता है कि यह देर हो चुकी है लेकिन यह किसी की मदद कर सकता है।

आप एक constraintLayout का उपयोग कर सकते हैं और xml में निम्न गुण जोड़ सकते हैं,

        android:elevation="4dp"

Answer 13

मुझे इससे निपटने का सबसे अच्छा तरीका मिला।

1. आपको लेआउट पर एक ठोस आयत पृष्ठभूमि सेट करने की आवश्यकता है।

2. इस कोड का उपयोग करें - ViewCompat.setElevation(view , value)

3. पैरेंट लेआउट सेट पर android:clipToPadding="false"

Comments

यदि आप नहीं जानते हैं, तो यह ViewCompat.setElevation()ViewCompat वर्ग पर विधि का वर्तमान कार्यान्वयन है public void setElevation(View view, float elevation) {}:। जैसा कि आप देख सकते हैं, यह लागू नहीं है। मुझे वास्तव में संदेह है कि यह किसी भी मदद का होगा, और वास्तव में आश्चर्य होगा कि क्या आपने वास्तव में अपने स्वयं के उत्तर का परीक्षण किया है, lol

— mradzinski