प्रतिशत मूल्यों के साथ कैसे करें ConstraintLayout काम?

Question

Android Studio 2.2 के पूर्वावलोकन 1 के साथ Google ने अपने समर्थन पुस्तकालय में एक नया लेआउट जारी किया ConstraintLayout:। ConstraintLayout के साथ एंड्रॉइड स्टूडियो में एक डिज़ाइन टूल का उपयोग करना आसान है, लेकिन मुझे रिश्तेदार आकार (रैखिक में 'वेट' या 'वेट' का उपयोग करने का तरीका नहीं मिला)। क्या पेरिकेंट्स पर आधारित बाधाओं को परिभाषित करने का एक तरीका है? जैसे किसी दृश्य को स्क्रीन का 40% लेते हैं, दृश्यों के बीच 20% का मार्जिन बनाते हैं, दृश्य की चौड़ाई को दूसरे दृश्य की चौड़ाई के 50% तक सेट करते हैं?

Comments

चौड़ाई या ऊंचाई के लिए प्रतिशत समर्थन version 1.1कांस्ट्रेन्थलाईटआउट में जोड़ा गया था । Developer.android.com/reference/android/support/constraint/… या कुछ नए उत्तरों पर "प्रतिशत आयाम" देखें ।

— सूर्योपासक

Answer 1

आप वर्तमान में कुछ तरीकों से ऐसा कर सकते हैं।

एक दिशा-निर्देश बनाने के लिए है (डिज़ाइन क्षेत्र पर राइट-क्लिक करें, फिर वर्टिकल / हॉरिज़ॉन्टल गाइडलाइन पर क्लिक करें)। फिर आप प्रतिशत आधारित होने के लिए स्थिति बदलने के लिए दिशानिर्देश के "हेडर" पर क्लिक कर सकते हैं। अंत में, आप दिशा-निर्देशों पर विचार कर सकते हैं।

एक अन्य तरीका यह है कि पूर्वाग्रह (प्रतिशत) का उपयोग करके किसी दृश्य को देखें और फिर उस दृश्य को अन्य विचारों को लंगर दें।

उन्होंने कहा, हम इस बारे में सोच रहे हैं कि प्रतिशत आधारित आयामों की पेशकश कैसे करें। मैं कोई वादा नहीं कर सकता, लेकिन यह कुछ ऐसा है जिसे हम जोड़ना चाहते हैं।

Comments

0 वोट नीचे मैं एक अनुवर्ती पूछ सकते हैं? मैं एक ImageView 60% चौड़ाई निर्धारित करने की कोशिश कर रहा हूं, लेकिन 16: 9 पहलू अनुपात बनाए रखता हूं। मैं चाहता हूं कि चौड़ाई निश्चित हो, लेकिन ImageView की ऊंचाई गतिशील हो। क्या ऐसा कॉन्स्ट्रेन्थलाईट के साथ संभव है? मैं इसे काम करने के लिए संघर्ष कर रहा हूं - मैं 0 की निश्चित चौड़ाई / ऊंचाई मूल्यों के साथ समाप्त करता हूं जब तक कि मैं हार्डकोडेड आयाम निर्दिष्ट नहीं करता।

— MattWilliams89

@ MattWilliams89 वहाँ एक पैरामीटर है जिसे कहा जाता है layout_constraintDimensionRatio, मुझे लगता है कि यह आपके मामले में उपयोगी हो सकता है, "16: 9" लिखें। मैं इसके साथ आपके लेआउट को बनाने की कोशिश में सफल नहीं हुआ, हालांकि, छवि बहुत बड़ी हो जाती है

— यूरी फेडोरोव

@RomainGuy आप गाइडलाइन के हेडर पर प्रतिशत में होने के लिए स्थिति कैसे बदलते हैं? मैंने इसे राइट क्लिक करने की कोशिश की है और कुछ भी नहीं दिखाता है

— एडिजे क्रूसर

गाइडलाइन के हेडर के बारे में ठीक-ठीक सोच रहे लोगों के लिए, यह एक ऐसा सर्कल है जिसमें ऊपर या नीचे तीर या एक प्रतिशत प्रतीक है। ऐप के बीच उस टॉगल को क्लिक करना: लेआउट_constraintGuide_begin, ऐप: लेआउट_constraintGuide_end, और ऐप: XML में लेआउट_constraintGuide_percent। मुझे एक छोटी सी समस्या का सामना करना पड़ा (कांस्ट्रेन्थ लयआउट संस्करण 1.0.0-अल्फ़ा 8 पर, जहाँ मुझे दिशानिर्देश पर क्लिक करना था, अपने माउस को पकड़ना था, और संपादक में इन्हें टॉगल करने के लिए घेरे में खींचें, लेकिन मुझे यकीन है कि यह बग जल्द ही ठीक हो जाएगा ।

— lustig

आप इसका उपयोग लेआउट के XML में भी कर सकते हैंapp:layout_constraintGuide_percentage

— piratemurray

Answer 2

यहां एक त्वरित संदर्भ होना उपयोगी हो सकता है।

विचारों का स्थान

एक का प्रयोग करें दिशानिर्देश के साथ app:layout_constraintGuide_percentइस तरह:

<androidx.constraintlayout.widget.Guideline
    android:id="@+id/guideline"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.5"/>

और फिर आप इस दिशानिर्देश का उपयोग अन्य दृश्यों के लिए एंकर पॉइंट के रूप में कर सकते हैं।

या

जब उपलब्ध स्थान की अनुमति देता है तो पूर्वाग्रह के साथ app:layout_constraintHorizontal_biasऔर / या app:layout_constraintVertical_biasदृश्य स्थान को संशोधित करने के लिए उपयोग करें

<Button
    ...
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintHorizontal_bias="0.25"
    ...
    />

विचारों का आकार

अन्य प्रतिशत आधारित मूल्य तत्वों की ऊंचाई और / या चौड़ाई है, app:layout_constraintHeight_percentऔर / या app:layout_constraintWidth_percent:

<Button
    ...
    android:layout_width="0dp"
    app:layout_constraintWidth_percent="0.5"
    ...
    />

Comments

इसकी चौड़ाई 1dp पर सेट क्यों होती है?

— user924

@ user924 यह एक दिशानिर्देश को 0dp की चौड़ाई देने के लिए समझ में आता है, मुझे नहीं पता कि डेवलपर्स ने इसे 1dp पर क्यों लागू किया। हो सकता है क्योंकि वजन का उपयोग करते समय 0dp को "खिंचाव" के रूप में माना जाता है।

— अमीर उवाल

@ user924: 0dpगतिशील आकार को इंगित करने के लिए ConstraintLayout में उपयोग किया जाता है। देखें डेवलपर

— .android.com/reference/android/support/constraint/…

@ सर्व-इन लेकिन यहाँ 1dp, नहीं 0dp.. यह मैं क्या बात कर रहा हूँ

— user924

@ user924: आपको इसे एक चौड़ाई पर सेट करना होगा। 0dpपहले से ही आरक्षित है, इसलिए 1dpसमझदार लगता है।

— सर्व-

Answer 3

"ConstraintLayout1.1.0-beta1" के रूप में आप चौड़ाई और ऊंचाइयों को परिभाषित करने के लिए प्रतिशत का उपयोग कर सकते हैं।

android:layout_width="0dp"
app:layout_constraintWidth_default="percent"
app:layout_constraintWidth_percent=".4"

यह स्क्रीन की चौड़ाई का 40% होने की चौड़ाई को परिभाषित करेगा। प्रतिशत में इस और दिशानिर्देशों का एक संयोजन आपको इच्छित प्रतिशत-आधारित लेआउट बनाने की अनुमति देता है।

Comments

बाधा लेआउट 1.0.2 में प्रतिशत के लिए मूल्य layout_constraintWidth_default समर्थित नहीं है। मुझे लगता है कि सही तरीका गाइडलाइन का उपयोग करना है।

— वोवहॉस्ट

यह 20 अक्टूबर, 2017 को निर्मित एंड्रॉइड स्टूडियो 3.0 के साथ काम कर रहा है

— douarbou

जैसा कि उत्तर में कहा गया है कि यह version 1.1कॉन्स्ट्रेन्थलाईटआउट में जोड़ा गया था । _default="percent"स्थिर संस्करण पर अतिरिक्त की आवश्यकता नहीं है! डेवलपर पर "प्रतिशत आयाम" देखें

— ।android.com

@होर्ड, एक व्यू वाले टेक्स्ट के लिए, जिसका आकार spइकाइयों में परिभाषित किया जाना है , टेक्स्ट का आकार देखने के आकार के लिए ऑटो-आनुपातिक कैसे हो सकता है (जो कि, अपने आप में, लेआउट के कुल आकार के अनुपात में परिभाषित किया गया है, अर्थात 'प्रतिशत') ?

— परमानंद

Answer 4

ConstraintLayout v1.1 की नई रिलीज़ के साथ अब आप निम्नलिखित कार्य कर सकते हैं:

<Button
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.2"
app:layout_constraintWidth_percent="0.65" />

यह बटन को 20% ऊंचाई और 65% पैरेंट व्यू की चौड़ाई के लिए बाध्य करेगा।

Comments

मेरे लिए केवल तभी काम किया जब मैं "एंड्रॉइड:" से "ऐप:" -> ऐप में बदल गया: लेआउट_constraintHeight_percent = "0.2"

— किरिल

सामग्री डिजाइन के द्रव लेआउट का पालन करते समय यह मेरे लिए बहुत जरूरी है। material.io/design/layout/…

@ आदम, पाठ युक्त एक दृश्य के लिए, जिसका आकार spइकाइयों में परिभाषित किया गया है, पाठ का आकार देखने के आकार के लिए ऑटो-आनुपातिक कैसे हो सकता है (जो कि, अपने आप में, लेआउट के कुल आकार के आनुपातिक रूप से परिभाषित किया गया है, अर्थात 'प्रतिशत') ?

— परमानंद

@ इस तरह की ध्वनियाँ मदद कर सकती हैं: developer.android.com/guide/topics/ui/look-and-feel/… मैंने हालांकि स्वयं इसका कभी उपयोग नहीं किया है।

— एडम

Answer 5

दिशानिर्देशों का उपयोग कैसे करें

स्वीकृत उत्तर दिशानिर्देशों का उपयोग करने और "हेडर" क्या है, इसके बारे में थोड़ा अस्पष्ट है।

कदम

सबसे पहले एक दिशानिर्देश जोड़ें।

दिशानिर्देशों का चयन करें या बाधाओं को स्पष्ट करने के लिए इसे थोड़ा स्थानांतरित करें।

तब गोल सर्कल ("हेडर") पर क्लिक करें जब तक कि यह एक प्रतिशत न हो जाए। फिर आप इस प्रतिशत को 50% या जो भी आप चाहते हैं नीचे खींच सकते हैं।

उसके बाद आप इसे पेरेंट का कुछ प्रतिशत ( match_constraintदृश्य पर उपयोग ) करने के लिए अपने विचार को दिशानिर्देश के लिए विवश कर सकते हैं ।

Comments

The हेडर ’कहां दिखाई देना चाहिए? यह मेरे विचार में नहीं दिखा।

— Marcel50506

@ Marcel50506, सुनिश्चित करें कि दोनों डिज़ाइन और ब्लूप्रिंट दृश्य दिखा रहे हैं। यह आपको इसे देखने में सक्षम होने का सबसे अच्छा मौका देगा। यदि आप दिशानिर्देश रेखा देख सकते हैं, तो उसे चुनने के लिए उस पर क्लिक करके देखें। यदि आप लाइन नहीं देख सकते हैं, तो घटक ट्री मेनू में दिशानिर्देश आइटम पर क्लिक करने का प्रयास करें जो बाईं ओर से बंद होना चाहिए (यह मानते हुए कि आपने पहले से ही एक दिशानिर्देश जोड़ा है)।

— सूर्याग 11

मुझे मंडली दिखाई नहीं देती है, लेकिन दिशानिर्देश के बाईं ओर क्लिक करने पर मैं इसे प्रतिशत में बदल सकता हूं .. रेंडर मुद्दा मुझे लगता है। धन्यवाद।

— मार्सेल 50506

यह सबसे अच्छा जवाब है क्योंकि यह बेहतर लेआउट दृष्टिकोण का प्रस्ताव करता है। हम केवल एक दृश्य पर प्रतिशत जोड़ने के बजाय आधार-दिशानिर्देश पर कई विचार संरेखित कर सकते हैं

— गुयेन मिन्ह हिएन

Answer 6

दिशा-निर्देश अमूल्य है - और ऐप: लेआउट_कॉन्स्ट्रैंटगुइडे_परेंट एक बहुत अच्छा दोस्त है ... हालांकि कभी-कभी हम दिशानिर्देशों के बिना प्रतिशत चाहते हैं। अब वज़न का उपयोग करना संभव है :

android:layout_width="0dp"
app:layout_constraintHorizontal_weight="1"

यहाँ एक और पूर्ण उदाहरण है जो अतिरिक्त भार के साथ एक दिशानिर्देश का उपयोग करता है :

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    tools:context="android.itomerbu.layoutdemo.MainActivity">

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.44"/>

    <Button
        android:id="@+id/btnThird"
        android:layout_width="0dp"
        app:layout_constraintHorizontal_weight="1"
        android:layout_height="wrap_content"
        android:text="@string/btnThird"
        app:layout_constraintLeft_toLeftOf="parent"
        android:layout_marginBottom="8dp"
        app:layout_constraintRight_toLeftOf="@+id/btnTwoThirds"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"/>

    <Button
        android:id="@+id/btnTwoThirds"
        app:layout_constraintHorizontal_weight="2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="@string/btnTwoThirds"
        app:layout_constraintBottom_toBottomOf="@+id/btnThird"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/btnThird"/>
</android.support.constraint.ConstraintLayout>

Comments

@Plumbus - वजन प्रतिशत के बराबर है (किसी भी प्रतिशत को गणितीय रूप से एक वजन में बदला जा सकता है और इसके विपरीत)। शब्दावली पर नाइट-पिकी होने से आप उत्तर के बिंदु को याद करते हैं।

— स्कॉट बिग्स

Answer 7

ConstraintLayout v1.1.2 के साथ, आयाम करने के लिए सेट किया जाना चाहिए 0dpऔर फिर सेट layout_constraintWidth_percentया layout_constraintHeight_percent0 और 1 की तरह मान के मध्य गुण:

<!-- 50% width centered Button -->
<Button
    android:id="@+id/button"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintWidth_percent=".5" />

(आप सेट की जरूरत नहीं है app:layout_constraintWidth_default="percent"या app:layout_constraintHeight_default="percent"ConstraintLayout 1.1.2 और निम्न संस्करणों के साथ)

Answer 8

बाधा लेआउट 1.0 एक दृश्य बनाने के लिए स्क्रीन का एक प्रतिशत लेने के लिए दो दिशानिर्देश बनाने की आवश्यकता होती है। बाधा लेआउट 1.1 में आपको सरलता से किसी प्रतिशत की चौड़ाई या ऊंचाई पर किसी भी दृश्य को बाधित करने की अनुमति देकर इसे सरल बना दिया गया है।

क्या यह शानदार नहीं है? सभी दृश्य लेआउट_ कॉन्स्ट्रेण्टविदथ_परेंट और लेआउट_कॉन्स्ट्रैंटहाइट_परेंट विशेषता का समर्थन करते हैं। ये उपलब्ध स्थान के प्रतिशत पर बाधा का कारण बनेंगे। इसलिए एक प्रतिशत स्क्रीन को भरने के लिए एक बटन या टेक्स्ट व्यू का विस्तार एक्सएमएल की कुछ पंक्तियों के साथ किया जा सकता है।

उदाहरण के लिए, यदि आप बटन की चौड़ाई 70% स्क्रीन पर सेट करना चाहते हैं, तो आप इसे इस तरह कर सकते हैं:

<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_constraintWidth_percent="0.7" />

कृपया ध्यान दें कि आपको आयाम को 0dp के प्रतिशत के रूप में उपयोग करना होगा क्योंकि हमारे पास निर्दिष्ट Android है: 0 से ऊपर 0 तक लेआउट_ उपलब्धता।

इसी तरह, यदि आप बटन की ऊंचाई 20% स्क्रीन पर सेट करना चाहते हैं, तो आप इसे इस तरह से कर सकते हैं:

<Button
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_constraintHeight_percent="0.2" />

देख! हमने इस समय एंड्रॉइड को निर्दिष्ट किया है: Layout_height to 0dp इस बार जब हम चाहते हैं कि बटन प्रतिशत के रूप में ऊंचाई का उपयोग करें।

Answer 9

इस कोड को आज़माएं। आप ऐप के साथ ऊँचाई और चौड़ाई प्रतिशत में परिवर्तन कर सकते हैं: layout_constraintHeight_percent और ऐप: layout_constraintWidth_percent।

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="#FF00FF"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHeight_percent=".6"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent=".4"></LinearLayout>

</android.support.constraint.ConstraintLayout>

Gradle:

dependencies {
...
    implementation 'com.android.support.constraint:constraint-layout:1.1.3'
}

Answer 10

आप app:layout_constraintVertical_weightइसे उसी रूप layout_weightमें उपयोग कर सकते हैंlinearlayout

<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">

<Button
    android:id="@+id/button4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@+id/button5"
    app:layout_constraintVertical_weight="1"/>

<Button
    android:id="@+id/button5"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintLeft_toRightOf="@+id/button4"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintVertical_weight="1"/>
</android.support.constraint.ConstraintLayout>

नोट: app:layout_constraintVertical_weight( app:layout_constraintHorizontal_weight) के साथ काम करेंगे android:layout_width="0dp"(android:layout_height="0dp"

Answer 11

किसी के लिए जो उपयोगी हो सकता है, आप layout_constraintDimensionRatioकिसी भी चाइल्ड व्यू का उपयोग अंदर ConstraintLayoutकर सकते हैं और हम दूसरे आयाम के अनुपात या चौड़ाई को परिभाषित कर सकते हैं (कम से कम किसी को 0dp की चौड़ाई या ऊँचाई का उदाहरण होना चाहिए)

 <ImageView
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:src="@drawable/top_image"
        app:layout_constraintDimensionRatio="16:9"        
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

इस मामले में पहलू अनुपात 16: 9 है app:layout_constraintDimensionRatio="16:9" आप यहां अधिक जानकारी पा सकते हैं

Answer 12

मुझे पता है कि यह सीधे नहीं है कि ओपी मूल रूप से क्या माँग रहा था लेकिन इससे मुझे इस स्थिति में बहुत मदद मिली जब मेरे पास एक समान प्रश्न था .. लेआउट विंडो का आकार बदलने के लिए देख रहे लोगों के लिए इसे जोड़ना (जो मैं नियमित रूप से उपयोग करता हूं), कोड के माध्यम से । प्रश्न की गतिविधि में इसे अपने ऑनक्रिएट में जोड़ें। (इसे 80% तक बदल देता है)

DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);

int width = dm.widthPixels;
int height = dm.heightPixels;

getWindow().setLayout((int)(width * 0.8), (int)(height * 0.8));

Answer 13

बस, अपने दिशानिर्देश टैग में बस प्रतिस्थापित करें

app:layout_constraintGuide_begin="291dp"

साथ में

app:layout_constraintGuide_percent="0.7"

जहां 0.7 का मतलब 70% है।

इसके अलावा अगर आप अब दिशानिर्देशों को खींचने की कोशिश करते हैं, तो खींचा गया मूल्य अब% आयु में दिखाई देगा।

Answer 14

दिशानिर्देशों का उपयोग करके आप स्थिति को प्रतिशत के आधार पर बदल सकते हैं

<android.support.constraint.Guideline
android:id="@+id/guideline"
android:layout_width="1dp"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5"/>

आप इस तरह से भी इस्तेमाल कर सकते हैं

android:layout_width="0dp"
app:layout_constraintWidth_default="percent"
app:layout_constraintWidth_percent="0.4"