ImageView - ऊंचाई मिलान चौड़ाई है?


166

मेरे पास एक इमेजव्यू है। मैं चाहता हूं कि इसकी चौड़ाई fill_parent हो। मैं चाहता हूं कि इसकी ऊंचाई जो भी हो, चौड़ाई समाप्त हो। उदाहरण के लिए:

<ImageView
  android:layout_width="fill_parent"
  android:layout_height="whatever the width ends up being" />

क्या लेआउट फाइल में ऐसा कुछ संभव है, बिना मेरी अपनी व्यू क्लास बनाए?

धन्यवाद


क्या आपको पता है कि यह कैसे करना है? मुझे लगता है कि आप चाहते हैं कि पहलू अनुपात समान रहे। इनमें से अधिकांश उत्तर मानते हैं कि आप चाहते हैं कि छवि चौकोर हो।
एडम

@ जो ब्लो कि यह करने के लिए एक बहुत बुरा तरीका है
एग्रेसर

जवाबों:


170

अपडेट: 14 सितंबर 2017

नीचे एक टिप्पणी के अनुसार, प्रतिशत समर्थन पुस्तकालय Android समर्थन पुस्तकालय 26.0.0 के रूप में पदावनत है। यह करने का नया तरीका है:

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="1:1" />

</android.support.constraint.ConstraintLayout>

यहाँ देखें

पदावनत:

Android Developers द्वारा इस पोस्ट के अनुसार , अब आपको बस एक पेरेंटरेलिवलाइवआउट या एक PercentFrameLayout के भीतर जो कुछ भी चाहिए उसे लपेटना है, और फिर इसके अनुपात को निर्दिष्ट करें, जैसे कि

<android.support.percent.PercentRelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        app:layout_widthPercent="100%"
        app:layout_aspectRatio="100%"/>

</android.support.percent.PercentRelativeLayout>

8
इस उत्तर के लिंक के पास सबसे सुंदर समाधान है जो Google प्रदान करता है। मेरे मामले में, मैं चाहता था कि छवि 16: 9 अनुपात में प्रदर्शित हो, कोई फर्क नहीं पड़ता कि मूल छवि पहलू अनुपात क्या है। बहुत अच्छा काम करता है। धन्यवाद!
LETs

Im मेरा मामला, इस तरह के समाधान एक काम नहीं किया, यह एक किया!
गूई

5
अपनी निर्भरता में 'संकलन com.android.support:percent:23.3.0' जोड़ना न भूलें
मिलाद फरीदिया

ऐसा लगता है कि यह दृष्टिकोण WrappedViewPager के साथ समस्या है जो कि इसके बच्चों की सामग्री के आधार पर ऊंचाई की गणना करता है। WrappedViewPager के लिए स्रोत के लिए इसी तरह gist.github.com/egslava/589b82a6add9c816a007
शा

1
Android समर्थन लाइब्रेरी 26.0.0 के बाद से प्रतिशत समर्थन मॉड्यूल को हटा दिया गया है। स्रोत: developer.android.com/topic/lbooks/support-library/…
MHogge

97

शायद यह आपके सवाल का जवाब देगा:

<ImageView
    android:id="@+id/cover_image"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:scaleType="fitCenter"
    android:adjustViewBounds="true" />

आप scaleTypeइस विशेष स्थिति के लिए विशेषता को अनदेखा कर सकते हैं ।


12
हाँ, यह बेकार है
फेटी

4
यह पूरी तरह से बेकार नहीं है। यह मेरे उपयोग के लिए ठीक काम करता है, मेरे पास एक शीर्षक पट्टी पर एक आइकन है जिसे मैं शेष वर्ग को भरने के लिए ऊंचाई को स्केल करना चाहता हूं।
अनुबियन नोब

3
मेरी समस्या का समाधान भी किया।
डायल्सन सेल्स

सबसे आसान तरीका! इसे सर्वश्रेष्ठ उत्तर के रूप में चिह्नित किया जाना चाहिए।
एच। फरीद

30

एक बार रनिंग के समय दृश्य की चौड़ाई जानने के बाद, लेआउट ऊंचाई को गतिशील रूप से सेट करने के लिए लेआउटप्रैम का उपयोग करके यह किया जा सकता है। क्रम में दृश्य की चौड़ाई प्राप्त करने के लिए आपको एक रन करने योग्य थ्रेड का उपयोग करने की आवश्यकता होती है, अन्यथा व्यू की चौड़ाई जानने से पहले आप ऊँचाई निर्धारित करने का प्रयास करेंगे क्योंकि लेआउट अभी तक नहीं खींचा गया है।

मैंने अपनी समस्या को कैसे हल किया, इसका उदाहरण:

final FrameLayout mFrame = (FrameLayout) findViewById(R.id.frame_id);

    mFrame.post(new Runnable() {

        @Override
        public void run() {
            RelativeLayout.LayoutParams mParams;
            mParams = (RelativeLayout.LayoutParams) mFrame.getLayoutParams();
            mParams.height = mFrame.getWidth();
            mFrame.setLayoutParams(mParams);
            mFrame.postInvalidate();
        }
    });

लेआउटपार्म्स, पैरेंट व्यू के प्रकार का होना चाहिए, जो आपके विचार में है। मेरा फ़्रेमलैट एक्सएमएल फ़ाइल में एक रिलेटिवलैटआउट के अंदर है।

    mFrame.postInvalidate();

UI थ्रेड की तुलना में एक अलग थ्रेड पर देखने के लिए मजबूर करने के लिए कहा जाता है


4
बहुत बढ़िया जवाब, खासकर रननेबल के साथ, धन्यवाद!
jesses.co.tt

1
जबकि यह काम करता है, यह आदर्श नहीं है। पोस्ट पर चलने का मतलब है कि लेआउट बदलने से पहले दृश्य एक बार प्रस्तुत हो। सही ढंग से ड्राइंग करने से पहले, गलत ऊंचाई पर सामग्री की फ्लैश की अनुमति दे सकता है। पहले हल करने के लिए बेहतर है। हल करने का सबसे पहला संभव क्षण एक रिवाज के दौरान है onMeasure, जैसा कि रेजिस के उत्तर में दिखाया गया है । एक वैकल्पिक, लेकिन केवल एक एडाप्टर के माध्यम से प्रस्तुत किए गए विचारों के लिए, जैसे अंदर GridView, मैट का जवाब है
टूलमेकरसैट

1
अच्छी तरह से यह मेरे requestLayout()लिए पैरामीटर सेट करने के बाद कॉल करने के बाद ही काम करता है। ऐसा क्यों होगा?
दिव्य मैथ्यू

mFrame.postInvalidate (); यह क्या है, इसके बिना मैं स्थिति से बाहर देखने को मिल रहा था।
जैकलैक Jac ’

17

मैं डेविड चू का उत्तर प्राप्त करने के लिए एक RecyclerView आइटम के लिए काम नहीं कर सका और मुझे लगा कि मुझे माता-पिता को ImageView को विवश करने की आवश्यकता है। ImageView चौड़ाई सेट करें 0dpऔर इसकी शुरुआत और अंत माता-पिता को विवश करें। मुझे यकीन नहीं है कि अगर कुछ मामलों में चौड़ाई निर्धारित करना wrap_contentया match_parentकाम करना है, लेकिन मुझे लगता है कि यह एक अच्छा तरीका है कि अपने माता-पिता को भरने के लिए एक कांस्टीट्यूएंटआउट का बच्चा प्राप्त करें।

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="1:1"/>

</android.support.constraint.ConstraintLayout>

13

यहाँ मैंने जो किया वह एक इमेजबटन है जिसकी चौड़ाई हमेशा ऊँचाई के बराबर होती है (और एक दिशा में बेवकूफ खाली मार्जिन से बचते हैं ... जिसे मैं एसडीके के बग के रूप में मानता हूं ...):

मैंने एक SquareImageButton वर्ग को परिभाषित किया जो ImageButton से निकला है:

package com.myproject;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.widget.ImageButton;

    public class SquareImageButton extends ImageButton {

        public SquareImageButton(Context context) {
        super(context);


        // TODO Auto-generated constructor stub
    }

    public SquareImageButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub

    }

    public SquareImageButton(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        // TODO Auto-generated constructor stub

    }

    int squareDim = 1000000000;

    @Override
    public void onMeasure(int widthMeasureSpec, int heightMeasureSpec){
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);


        int h = this.getMeasuredHeight();
        int w = this.getMeasuredWidth();
        int curSquareDim = Math.min(w, h);
        // Inside a viewholder or other grid element,
        // with dynamically added content that is not in the XML,
        // height may be 0.
        // In that case, use the other dimension.
        if (curSquareDim == 0)
            curSquareDim = Math.max(w, h);

        if(curSquareDim < squareDim)
        {
            squareDim = curSquareDim;
        }

        Log.d("MyApp", "h "+h+"w "+w+"squareDim "+squareDim);


        setMeasuredDimension(squareDim, squareDim);

    }

}

यहाँ मेरा xml है:

<com.myproject.SquareImageButton
            android:id="@+id/speakButton"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:scaleType="centerInside"
            android:src="@drawable/icon_rounded_no_shadow_144px"
            android:background="#00ff00"
            android:layout_alignTop="@+id/searchEditText"
            android:layout_alignBottom="@+id/searchEditText"
            android:layout_alignParentLeft="true"
           />

एक जादू की तरह काम करता है !


हाँ, यह सबसे अच्छा जवाब है। (और केवल एक है कि वास्तव में
ओपीएस

6

Android में 26.0.0 PercentRelativeLayout को हटा दिया गया है

इसे हल करने का सबसे अच्छा तरीका अब ConstraintLayoutइस तरह है:

<android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

    <ImageView android:layout_width="match_parent"
               android:layout_height="0dp"
               android:scaleType="centerCrop"
               android:src="@drawable/you_image"                       
               app:layout_constraintDimensionRatio="1:1"/>


</android.support.constraint.ConstraintLayout>


यहाँ एक ट्यूटोरियल है कि कैसे ConstraintLayoutअपनी परियोजना में जोड़ें ।


6

यदि आपकी छवि दृश्य एक बाधा लेआउट के अंदर है, तो आप चौकोर छवि दृश्य बनाने के लिए निम्नलिखित बाधाओं का उपयोग कर सकते हैं

<ImageView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:id="@+id/ivImageView"
    app:layout_constraintDimensionRatio="W,1:1"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"/>

5

आप इसे अकेले लेआउट के साथ नहीं कर सकते, मैंने कोशिश की है। मैंने इसे संभालने के लिए एक बहुत ही सरल वर्ग लिखा है, आप इसे गीथूब पर देख सकते हैं। SquareImage.java एक बड़ी परियोजना का हिस्सा है, लेकिन कुछ भी कॉपी और पेस्ट कुछ भी ठीक नहीं कर सकता है (Apache 2.0 के तहत लाइसेंस प्राप्त)

अनिवार्य रूप से आपको बस दूसरे आयाम के बराबर ऊँचाई / चौड़ाई निर्धारित करने की आवश्यकता होती है (इस पर निर्भर करता है कि आप इसे किस पैमाने पर रखना चाहते हैं)

नोट: आप इसे scaleTypeगुण का उपयोग कर एक कस्टम वर्ग के बिना वर्ग बना सकते हैं लेकिन दृश्य की सीमा दृश्यमान छवि से परे विस्तारित होती है, जो इसे एक मुद्दा बनाती है यदि आप इसके पास अन्य विचार रख रहे हैं।


3

अपने ImageView को आधे स्क्रीन के बराबर सेट करने के लिए, आपको ImageView के लिए अपने XML में निम्न जोड़ना होगा:

<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerInParent="true"
    android:scaleType="fitXY"
    android:adjustViewBounds="true"/>

इस चौड़ाई के बराबर ऊँचाई सेट करने के लिए, आपको इसे कोड में करने की आवश्यकता है। getViewअपने GridViewएडॉप्टर की विधि में , ImageViewउसकी मापा चौड़ाई के बराबर ऊँचाई सेट करें :

mImageView.getLayoutParams().height = mImageView.getMeasuredWidth();

3

अब तक गुजर रहे लोगों के लिए, 2017 में, इस तरह से कॉन्स्ट्रेनल लयआउट का उपयोग करके जो आप चाहते हैं उसे प्राप्त करने का नया सबसे अच्छा तरीका है :

<ImageView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:scaleType="centerCrop"
    app:layout_constraintDimensionRatio="1:1" />

और अपने लेआउट द्वारा आवश्यकतानुसार चारों दिशाओं में बाधाओं को जोड़ना न भूलें।

कांस्ट्रैण्टाइलेआउट के साथ एक उत्तरदायी यूआई बनाएँ

इसके अलावा, अब तक, PercentRelativeLayout को हटा दिया गया है ( Android प्रलेखन देखें )।


1

यहाँ मैंने उस समस्या को हल किया है:

int pHeight =  picture.getHeight();
int pWidth = picture.getWidth();
int vWidth = preview.getWidth();
preview.getLayoutParams().height = (int)(vWidth*((double)pHeight/pWidth));

पूर्वावलोकन - imageView चौड़ाई के साथ "match_parent" और "फसल काटने वाले" के पैमाने पर आ गया है

चित्र - इमेज व्यू src में सेट करने के लिए बिटमैप ऑब्जेक्ट।

यह मेरे लिए बहुत अच्छा काम करता है।


आपने यह नहीं बताया है कि यह कोड कहां रखा जाना चाहिए। आपने यह भी स्पष्ट नहीं किया है कि आप = vw*ph/pwसरल के बजाय क्यों करते हैं = vw। (मुझे लगता है कि आप एक वर्ग पूर्वावलोकन को लागू करने के बजाय स्रोत छवि के पहलू अनुपात को संरक्षित करने के लिए ऐसा करते हैं।)
टूलमेकरसैट

0

मुझे नहीं लगता कि XML लेआउट फ़ाइल में आप ऐसा कर सकते हैं, और मुझे नहीं लगता कि android:scaleTypeविशेषता आपको पसंद आएगी।
एकमात्र तरीका यह होगा कि इसे प्रोग्रामेटिक रूप से किया जाए। आप fill_parent के लिए चौड़ाई सेट कर सकते हैं और या तो स्क्रीन की चौड़ाई ले सकते हैं क्योंकि ऊँचाई Viewया View.getWidth()विधि का उपयोग कर सकते हैं ।


0

ImageView "स्केलटेप" फ़ंक्शन आपको यहाँ मदद कर सकता है।

यह कोड पहलू अनुपात को बनाए रखेगा और छवि को शीर्ष पर रखेगा:

android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitStart"

यहाँ स्केलपाइप का उपयोग करने से संभावनाओं और दिखावे को दर्शाने वाला एक शानदार पोस्ट है।

ImageView स्केलपाइप नमूने


"स्केल टाइप" यहां मदद नहीं करता है। लक्ष्य के लिए ImageView ही हमेशा वर्गाकार होना चाहिए, न कि केवल इसके अंदर की छवि। पैमाने के साथ, ImageView छवि से बड़ा हो सकता है।
टूलमेकरसेव

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.