অ্যান্ড্রয়েড লিনিয়ারলআউট: একটি লিনিয়ারলআউটের চারদিকে ছায়ার সাথে সীমানা যুক্ত করুন


147

উদাহরণ হিসাবে আমি এই লিনিয়ারলআউটের একই সীমানা তৈরি করতে চাই:

এখানে চিত্র বর্ণনা লিখুন

এই উদাহরণে, আমরা দেখতে পারি যে লিনিয়ারালাউট চারপাশে সীমানা একই নয়। আমি কীভাবে এটি এক্সএমএল অঙ্কনযোগ্য ফাইল ব্যবহার করে তৈরি করতে পারি?

আপাতত, আমি কেবল লিনিয়ারলআউট এর চারপাশে একটি সাধারণ সীমানা তৈরি করতে সক্ষম হয়েছি:

<?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>

1
আপনি তার জন্য backgroundসম্পত্তি ব্যবহার করতে পারেন ... এর জন্য আয়তক্ষেত্র, রঙ এবং ছায়া প্রভাব মতো আকৃতির একটি এক্সএমএল ফাইল তৈরি করুন এবং এটি আপনার রৈখিক বিন্যাসের পটভূমি হিসাবে সেট করুন ..
প্রগনেশ ঘোদা シ

ধূসর সীমানা এবং প্যাডিং এফেক্টের জন্য
স্ট্রোকও ব্যবহার করুন

আমি মনে করি, এটির দুটি লেআউট এক্সএমএল বলে, একটি লিনিয়ার লেআউট এবং অভ্যন্তরটি আপেক্ষিক লেআউটে প্যাডিং রয়েছে
গিরু ভাই

@ প্রাগস এই এক্সএমএল ফাইলটি তৈরি করতে আপনি আমাকে সহায়তা করতে পারেন দয়া করে?
wawanopoulos

1
একটি বিকল্প উপায় আপনার লেআউটের পটভূমি হিসাবে 9 প্যাচ চিত্রটি ব্যবহার করা যেতে পারে। এটি সত্যিই মসৃণ, বিবর্ণ ছায়ার জন্য অনুমতি দেবে (অনেক বাস্তববাদী, আমার মতে)।
ফ্যান্টিম্যাক্সএক্স

উত্তর:


257

এটা চেষ্টা কর..

<?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>

@ হারিহরণ অনেক ধন্যবাদ! আমি আপনার কোড চেষ্টা করেছিলাম এবং এটি ঠিক আছে বলে মনে হচ্ছে। তবে, এখনও একটি কাজ করার আছে, আমি কীভাবে বামে এবং রৈখিক ডানদিকে একটি পাতলা সীমানা (1 ডিপি) যুক্ত করতে পারি? (উদাহরণস্বরূপ)
ওয়াওয়ানোপ্লোস

2
@ ওয়াওয়ানোপুল্লোস হরিহরানের উত্তরের "0dp"সাথে কেবল প্রতিস্থাপন করুন "1dp"
ফ্যান্টিম্যাক্সএক্স

আপনি প্যারেন্ট লেআউটে #EAEAEA রঙ যুক্ত করতে পারেন যাতে এটি প্রশ্নের চিত্রের মতো হবে
সামাদ

3
আমিও সুপারিশ এই জন্য, আপনি ব্যবহার করতে পারেন হবে <gradient>আপনার <shape>সীমান্ত প্রভাব উন্নত, এবং এছাড়াও যদি এটা সত্যিই প্রভাব আপনার ইউআই শুধু একরঙা সীমান্ত পরিবর্তে প্রয়োজন।
patrickjason91

আপনার যদি ম্যাচ প্যারেন্টের সাথে অভ্যন্তরীণ বিন্যাস থাকে তবে তা অভ্যন্তরীণ বিন্যাসে 1-মার্জিন দিন
শক্তিসিংহ জাদেজা

82

এজন্য কার্ডভিউ বিদ্যমান। কার্ডভিউ | অ্যান্ড্রয়েড বিকাশকারী
এটি কেবলমাত্র একটি ফ্রেম-লেআউট যা প্রাক-ললিপপ ডিভাইসে উচ্চতা সমর্থন করে।

<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.+'

ছায়ার রঙ কীভাবে বদলাতে পারে
অদিতায় কাউশাল

ছায়া খুব দুর্বল stackoverflow.com/questions/49076188/...
user924

1
4.4.4 (বা অনুরূপ) সহ ডিভাইসে খুব অদ্ভুত আচরণ। কার্ডভিউতে একটি বিশাল মার্জিন যুক্ত হয়ে ইউআইকে খুব কুৎসিত করে।
মরতেজা রাস্টগু

এটি গ্রহণযোগ্য উত্তর হওয়া উচিত। একটি ছোট আপডেট যদিও। > Androidx.cardview.widget.CardView - তুমি androidx এক ব্যবহার করা উচিত
Bogdan

59

আমি 9 প্যাচ গ্রাফিক ব্যবহার করে সর্বাধিক দেখার ফলাফল পেয়েছি।

আপনি কেবল নিম্নলিখিত সম্পাদকটি ব্যবহার করে একটি পৃথক 9 প্যাচ গ্রাফিক তৈরি করতে পারেন: http://inloop.github.io/shadow4android/

উদাহরণ:

9 প্যাচ গ্রাফিক:

9 প্যাচ গ্রাফিক:

ফলাফল:

এখানে চিত্র বর্ণনা লিখুন

উৎস:

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

1
আমি কীভাবে কালো রেখাটি আড়াল করতে পারি? দয়া করে সহায়তা করুন
ইসহাক ডারলং

@Isaac my_nine_patch.9.png হিসাবে ইমেজ সংরক্ষণ করুন (.9.png 9 ব্যাচ ইমেজ)
অরুণ

এটিই সর্বোত্তম!
নুমনকমার

35

ঠিক আছে, আমি জানি এটা অনেক দেরিতে। তবে আমারও একই চাহিদা ছিল। আমি এই মত সমাধান

1. প্রথম "অঙ্কনযোগ্য" ফোল্ডারে একটি এক্সএমএল ফাইল তৈরি করুন (উদাহরণ: সীমানা_শাদো.এক্সএমএল) এবং নীচে কোডটি এতে অনুলিপি করুন।

<?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>

২. আপনি যে লেআউটটিতে ছায়া চান সেটি এখন (উদাহরণ: লিনিয়ারলআউট) এন্ড্রয়েড: ব্যাকগ্রাউন্ডে যুক্ত করুন

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

এবং এটা আমার জন্য কাজ করেছে।


20

এটি এত সহজ:

এর মতো গ্রেডিয়েন্ট সহ একটি অঙ্কনযোগ্য ফাইল তৈরি করুন:

দেখুন নীচের ছায়া জন্য 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>

এবং ডান এবং বাম ছায়ার জন্য কেবল গ্রেডিয়েন্টের কোণ পরিবর্তন করুন :)


আমি যেখানে নীচে _ শ্যাডো কল করব? একটি পটভূমি?
আর্থার মেলো

1
নীচে_শেডো এক্সএমএল ফাইল তৈরি করুন, তারপরে আপনার দৃষ্টিতে আপনার বিন্যাসে একটি "দেখুন" যুক্ত করুন এবং নীচের_শাদো.এক্সএমএলটিকে এই দৃশ্যের পটভূমি হিসাবে সেট করুন
মোর্তিজা রাস্টগু

আপনি যেমন বলেছিলেন তেমনই আমি করেছি, তবে আমি যখন এই দৃষ্টিভঙ্গিটি কাস্টম ভিউতে রাখি তখন আমার "উপরের_শাদো" স্বচ্ছ হয় না। এটি আলাদাভাবে কাজ করে। আমার কি করা উচিৎ?
সোয়াং

18

বিকল্প হিসাবে, আপনি আপনার লেআউটের ব্যাকগ্রাউন্ড হিসাবে 9 প্যাচ চিত্রটি ব্যবহার করতে পারেন, আরও "প্রাকৃতিক" ছায়ার জন্য অনুমতি দিচ্ছেন:

এখানে চিত্র বর্ণনা লিখুন

ফলাফল:

এখানে চিত্র বর্ণনা লিখুন

আপনার /res/drawableফোল্ডারে চিত্রটি রাখুন ।
নিশ্চিত করুন ফাইল এক্সটেনশন হল .9.pngনা.png

যাইহোক, এটি API 19 এসডিকে সংস্থান ফোল্ডারে পাওয়া একটি বিদ্যমান সংস্থার একটি পরিবর্তিত (সর্বনিম্ন বর্গ আকারে হ্রাস)।
আমি রেড মার্কারগুলি রেখেছি, যেহেতু এগুলি ক্ষতিকারক বলে মনে হচ্ছে না, যেমন ড্র 9 প্যাচ সরঞ্জামটিতে দেখানো হয়েছে।

[Edit]

প্রায় 9 টি প্যাচ, যদি আপনার সাথে তাদের কোনও সম্পর্ক না হয়।

এটি কেবল আপনার দর্শনের পটভূমি হিসাবে যুক্ত করুন।

কালো-চিহ্নিত অঞ্চলগুলি (বাম এবং উপরে) প্রসারিত হবে (উল্লম্বভাবে, অনুভূমিকভাবে)।
কালো-চিহ্নিত অঞ্চলগুলি (ডানদিকে, নীচে) "সামগ্রী অঞ্চল" সংজ্ঞায়িত করে (যেখানে পাঠ্য বা ভিউগুলি যুক্ত করা সম্ভব - আপনি যদি পছন্দ করেন তবে চিহ্নযুক্ত অঞ্চলগুলিকে "প্যাডিং" বলতে পারেন)।

টিউটোরিয়াল: http://radleymarx.com/blog/simple-guide-to-9-patch/


1
এটি কেবল আপনার দর্শনের পটভূমি হিসাবে যুক্ত করুন। কালো-চিহ্নিত অঞ্চলগুলি (বাম এবং উপরে) প্রসারিত হবে (উল্লম্বভাবে, অনুভূমিকভাবে)। কালো-চিহ্নিত অঞ্চলগুলি (ডান, নীচে) "সামগ্রী অঞ্চল" (যেখানে পাঠ্য বা ভিউগুলি যুক্ত করা সম্ভব - এটি যদি আপনার পছন্দ হয় তবে "প্যাডিং" বলুন) সংজ্ঞায়িত করে। টিউটোরিয়াল: Radleymarx.com/blog/simple-guide-to-9-patch
ফ্যান্টাম্যাক্সেক্স

9

আপনি ড্রপ_স্যাডো.এক্সএমএল সহ অঙ্কনযোগ্য একটি ফাইল .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"/>

3

এই একক লাইনটি ব্যবহার করুন এবং আশা করি আপনি সেরা ফলাফলটি অর্জন করবেন;

ব্যবহার: android:elevation="3dp" আপনার প্রয়োজনীয় আকারটি সামঞ্জস্য করুন এবং বোতাম এবং অন্যান্য ডিফল্ট অ্যান্ড্রয়েড ছায়ার মতো ছায়া অর্জনের এটি সর্বোত্তম এবং সহজতম উপায়। যদি এটি কাজ করে আমাকে জানাবেন!


@ মাইচাজিওব্রো আপনার লেআউটগুলির সাথে এটি ব্যবহার করুন যেমন আপনার যদি অন্যর চেয়ে ছোট কোন লেআউট থাকে এবং আপনি ছায়া দেখাতে চান। এটি কাজ করা উচিত. আপনি আপনার পাঠ্য এবং বোতামগুলি অদৃশ্য হয়ে যেতে পারেন তবে অ্যাপটি চালানোর সময় আপনি সেরা ছায়া দেখতে পাবেন। আমি নিশ্চিত নই যে এটি কোনও ধরণের বাগ বা কিছু আছে তবে আমার ক্ষেত্রে যখন আমি এই কোডটি ব্যবহার করি তখন এটি আমার সমস্ত ভিউগুলিকে AS পূর্বরূপে অদৃশ্য করে তোলে তবে আমি যখন আমার ডিভাইসে এটি ডিবাগ / লঞ্চ করি তখন অ্যাপে সেরা কাজ করে। এটি কাজ করে কি না তা আমাকে জানান। ধন্যবাদ।
তামিম

3

আপনার যদি ইতিমধ্যে আকৃতি থেকে সীমানা থাকে তবে কেবল উচ্চতা যুক্ত করুন:

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

2
এপিআই <21 এ একটি আচরণ কী?
কুলমাইন্ড

1
দুর্ভাগ্যক্রমে এটি ললিপপের আগে কাজ করে না তাই আপনার এই প্রশ্নটি থেকে অন্য কয়েকটি উত্তর ব্যবহার করা উচিত। তবে আপনি যদি নতুন ফোনগুলিকে টার্গেট করে থাকেন তবে এটি কার্যকরভাবে করার খুব সহজ উপায়।
ক্রিজিনুল

2

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="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
        android:id="@+id/header_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/shadow"
        android:orientation="vertical">

অনেক ধন্যবাদ স্যার, আপনার কোড ঠিক আছে বলে মনে হচ্ছে ...
জন দাহাট

1
@ জোহান্দাহাট ঠিক আছে
সুধীর সিংহ

1

ইয়া মাহদী আজ --- রিলেটিভলআউট এর জন্য

<?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>

1

আমি জানি এটি দেরি হয়ে গেছে তবে এটি কারওর পক্ষে সহায়তা করতে পারে।

আপনি সীমাবদ্ধ লেআউটটি ব্যবহার করতে পারেন এবং এক্সএমএলে নীচের সম্পত্তিটি যুক্ত করতে পারেন,

        android:elevation="4dp"

0

আমি এটি মোকাবেলার সেরা উপায় খুঁজে পেয়েছি।

  1. লেআউটে আপনাকে একটি শক্ত আয়তক্ষেত্রের পটভূমি সেট করতে হবে।

  2. এই কোডটি ব্যবহার করুন - ViewCompat.setElevation(view , value)

  3. প্যারেন্ট লেআউট সেটটিতে android:clipToPadding="false"


2
যদি আপনি জানেন না, এই বর্তমান বাস্তবায়ন ViewCompat.setElevation()ViewCompat বর্গ উপর পদ্ধতি: public void setElevation(View view, float elevation) {}। আপনি দেখতে পাচ্ছেন, এটি বাস্তবায়িত হয়নি। আমি সত্যিই সন্দেহ করি যে এটি কোনও
উপকারে আসবে
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.