ConstraintLayout पहलू अनुपात

Question

निम्नलिखित लेआउट फ़ाइल पर विचार करें: layout_constraintDimensionRatio काम करता है:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    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.support.constraint.ConstraintLayout 
     android:id="@+id/activity_main" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="#FF0000" 
     android:paddingBottom="@dimen/activity_vertical_margin" 
     android:paddingLeft="@dimen/activity_horizontal_margin" 
     android:paddingRight="@dimen/activity_horizontal_margin" 
     android:paddingTop="@dimen/activity_vertical_margin"> 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_height="0dp" 
      android:background="#0000FF" 
      android:padding="16dp" 
      app:layout_constraintBottom_toBottomOf="parent" 
      app:layout_constraintTop_toTopOf="parent" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintDimensionRatio="H,3:1" 
      tools:layout_editor_absoluteX="16dp" /> 

    </android.support.constraint.ConstraintLayout> 

</RelativeLayout> 

मुझे यकीन है कि कैसे एप्लिकेशन नहीं हूँ। मेरी समझ यह है कि अनुपात हमेशा चौड़ाई होगा: ऊंचाई। तो 3: 1 हमेशा छवि दृश्य को ऊंचाई से 3 गुना अधिक दिखाई देगा। उपसर्ग एच या डब्ल्यू ConstraintLayout बताता है कि आयाम अनुपात का सम्मान करना चाहिए। यदि यह एच है तो इसका मतलब है कि चौड़ाई को पहली बार अन्य बाधाओं से गणना की जाएगी और फिर ऊंचाई अनुपात के अनुसार ऊंचाई समायोजित की जाएगी।

ऊंचाई 3 बार चौड़ाई जो अप्रत्याशित है से भी बड़ा है: हालांकि इस लेआउट का परिणाम है। क्या कोई मुझे बता सकता है कि ऐप के संबंध में आयामों की गणना कैसे की जाती है: layout_constraintDimensionRatio सेटिंग?

Answer 1

इन ImageView गुण पर एक नज़र डालें:

app:layout_constraintBottom_toBottomOf="parent" 
    app:layout_constraintTop_toTopOf="parent" 
    app:layout_constraintLeft_toLeftOf="parent" 

इन गुणों को ओवरराइड जिसके कारण layout_constraintDimensionRatioImageView नीचे, ऊपर करने के लिए विवश और मुख्य माता पिता View में जिसके परिणामस्वरूप बाईं कब्जे के लिए छोड़ दिया है, मुख्य स्क्रीन के ऊपर और नीचे भाग।

app:layout_constraintBottom_toBottomOf="parent" 
    app:layout_constraintTop_toTopOf="parent" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintRight_toRightOf="parent" 

यह एक समाधान होगा। यदि आप दृश्य को शीर्ष पर या इसके विपरीत दिखाना चाहते हैं तो आप layout_constraintBottom_toBottomOf को छोड़ सकते हैं। यह शायद को छोड़कर सभी उपरोक्त बाधाओं को पूरी तरह से हटा दें, जो सबसे अधिक अनुशंसित समाधान होगा।

Answer 2

app:layout_constraintDimensionRatio काम के तरीके के लिए आपकी समझ सही है। यदि आप app:layout_constraintDimensionRatio="H,3:1" सेट करते हैं तो इसका मतलब है कि चौड़ाई को पहले अन्य बाधाओं से गणना की जाएगी और फिर ऊंचाई अनुपात के अनुसार ऊंचाई समायोजित की जाएगी। आपके कार्यान्वयन के साथ एकमात्र समस्या यह है कि आपने ImageView में app:layout_constraintBottom_toBottomOf="parent" जोड़ा, ताकि इसे अनदेखा करने के लिए app:layout_constraintDimensionRatio का कारण बन सके। 1 पहलू अनुपात:

यहाँ 3 में अपने imageView आकार के लिए लेआउट है

<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" 
    android:background="#FF0000"> 

    <ImageView 
     android:id="@+id/imageView" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:layout_marginStart="16dp" 
     android:layout_marginTop="16dp" 
     android:layout_marginEnd="16dp" 
     android:background="#0000FF" 
     app:layout_constraintTop_toTopOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintDimensionRatio="H,3:1" /> 

</android.support.constraint.ConstraintLayout> 

और यहाँ परिणाम दृश्य है: