पहलू अनुपात रखने के लिए ImageView में एक छवि कैसे स्केल करें


526

एंड्रॉयड में, मैं परिभाषित एक ImageView'एस layout_widthहोने के लिए fill_parent(जो फोन की पूरी चौड़ाई तक लगते हैं)।

अगर मैंने जो इमेज लगाई ImageViewहै layout_width, उससे बड़ी है , तो एंड्रॉइड इसे स्केल करेगा, है ना? लेकिन ऊंचाई के बारे में क्या? जब एंड्रॉइड छवि को स्केल करता है, तो क्या यह पहलू अनुपात रखेगा?

जब मुझे पता चलता है कि ImageViewएंड्रॉइड तराजू की छवि के ऊपर और नीचे कुछ सफेद स्थान है, जो कि इससे बड़ा है ImageView। क्या यह सच है? यदि हाँ, तो मैं उस सफेद स्थान को कैसे समाप्त कर सकता हूँ?

जवाबों:


799
  1. हां, डिफ़ॉल्ट रूप से एंड्रॉइड ImageView को फिट करने के लिए आपकी छवि को नीचे रखेगा, पहलू अनुपात बनाए रखेगा। हालाँकि, सुनिश्चित करें कि आप ImageView की android:src="..."बजाय छवि का उपयोग करके सेट कर रहे हैं android:background="..."src=यह पहलू अनुपात को बनाए रखने के लिए छवि को स्केल करता है, लेकिन background=यह पैमाने और छवि को विकृत करता है ताकि यह ImageView के आकार के बिल्कुल फिट हो सके। (आप एक ही समय में एक पृष्ठभूमि और एक स्रोत का उपयोग कर सकते हैं, जो मुख्य छवि के चारों ओर एक फ्रेम प्रदर्शित करने जैसी चीजों के लिए उपयोगी हो सकता है, केवल एक ImageView का उपयोग करके।)

  2. आपको यह भी देखना चाहिए android:adjustViewBoundsकि छवि को आकार बदलने के लिए ImageView खुद को आकार देता है। उदाहरण के लिए, यदि आपके पास एक आयताकार छवि है जो सामान्य रूप से एक वर्ग छवि दृश्य होगी, तो समायोजनदृश्यबाउंड = सत्य यह आयताकार होने के साथ ही छवि दृश्य का आकार बदल देगा। यह तब प्रभावित करता है कि ImageView के आसपास अन्य दृश्य कैसे रखे गए हैं।

    फिर जैसा कि सामू ने लिखा है, आप android:scaleTypeपैरामीटर का उपयोग करके छवियों को डिफ़ॉल्ट रूप से बदल सकते हैं । वैसे, यह पता लगाने का सबसे आसान तरीका है कि यह कैसे काम करता है! बस एमुलेटर (या एक वास्तविक फोन) में लेआउट को देखना याद रखें क्योंकि ग्रहण में पूर्वावलोकन आमतौर पर गलत है।


18
यह वही बात है, बस XML के बजाय कोड में किया गया है। setImageBitmapके रूप में ही है android:src="..."और setBackground...हैandroid:background="..."
स्टीव हेली

4
@SuperUser xml aswell में image.setImageDrawable(...)है android:src="..."
प्योरसाइडर

11
"एंड्रॉइड: एडजस्ट व्यूबाउंड्स" यहां ध्यान देने योग्य है! यदि आप इसे नहीं जोड़ते हैं, तो आप सबसे अधिक संभावना है कि ImageView बॉर्डर / सीमा / कंटेनर के साथ समस्याएँ सही तरीके से नहीं होंगी।
गुस्सा 84

2
src = बनाम बैकग्राउंड = मेरे लिए अंतर था!
क्रिस्टोफर रथबेब

21
android:adjustViewBoundsमेरी पहेली के लिए अंतिम टुकड़ा था, धन्यवाद!
थीमटक्का

281

देखते हैं android:adjustViewBounds

इसे सही पर सेट करें यदि आप चाहते हैं कि ImageView अपने ड्रॉबल के पहलू अनुपात को संरक्षित करने के लिए इसकी सीमा को समायोजित करे।


6
यह समस्या के लिए सही समाधान है। हम अपने छवि दृश्य पर यह कर रहे थे, जहां ऊंचाई में इस अतिरिक्त व्हाट्सएप के सभी शामिल थे। यह "पारदर्शी पिक्सेल" नहीं है, क्योंकि हमारे पास चौड़ाई के लिए fill_parent और ऊंचाई के लिए wra_content था। यदि आपके पास AdjustViewBounds = true नहीं है, तो आपको अतिरिक्त व्हाट्सएप मिलता है। इसे सच करने के बाद, हमारा मुद्दा चला गया। धन्यवाद!
क्रिस्टोफरकॉटन

3
धन्यवाद, यह और इसे स्थापित करने के लिए पृष्ठभूमि के बजाय src पूरी तरह से काम किया!
कैमरून


1
यह समस्या के लिए एकदम सही समाधान है। आकार के लिए, आकार सेट करने के लिए मूल कंटेनर का उपयोग करें, और ImageView में match_parent सेट करें। इससे काफी परेशानियों का हल निकलता है।
निमिला हिरण्य

बिंदु पर पहुंचने के लिए +1। मैंने शुरू में लिखा था कि एक अधिक "बोलचाल में" वाक्यांश और सॉफ ने मुझे इसे प्रस्तुत करने से रोक दिया। रफ़ल पंखों के बजाय एक पीसी गया।
Jacksonkr

168

किसी और को यह विशेष मुद्दा होने पर। आपके पास ImageViewएक चौड़ाई है जो आप की चौड़ाई fill_parentऔर समानुपातिक रूप से ऊँचाई बढ़ाना चाहते हैं:

इन दोनों विशेषताओं को अपने में जोड़ें ImageView :

android:adjustViewBounds="true"
android:scaleType="centerCrop"

और सेट करें ImageView चौड़ाई fill_parentऔर ऊंचाईwrap_content

इसके अलावा, यदि आप नहीं चाहते कि आपकी छवि खराब हो, तो यह प्रयास करें:

 android:adjustViewBounds="true"
 android:layout_centerInParent="true"

16
हां लेकिन आपकी छवि खराब हो जाती है। सही समाधान चौड़ाई तक फैल जाएगा, पहलू अनुपात बनाए रखेगा और फसल नहीं। मुझे नहीं पता कि ऐसा करने के लिए इतना परेशान क्यों होना पड़ता है ...
Warpzit

1
मुझे या तो :( क्षमा करें अगर मेरे समाधान ने आपकी मदद नहीं की, लेकिन इससे मुझे मदद मिली।
केविन पार्कर

2
केविन, आपने जो कहा था, वह वही था जो मैं देख रहा था, अगर छवि का आकार स्क्रीन से कम है, तो यह ज़ूम इन और केंद्रित है, एकदम सही है। धन्यवाद।
सोहम

1
+1, "(या अन्य View)" को छोड़कर । AFAICT का कोई अन्य दृश्य adjustViewBoundsया scaleTypeविशेषता नहीं है।
लार्स

एंड्रॉइड का उपयोग करने के बारे में कैसे: scaleType = "centerInside" के बजाय android: scaleType = "centerCrop"? यह छवि को क्रॉप नहीं करेगा बल्कि यह सुनिश्चित करेगा कि चौड़ाई और ऊँचाई दोनों छवि की चौड़ाई और ऊँचाई से कम या बराबर हों :) यहाँ स्केलेटेप्स के लिए एक अच्छा विज़ुअल गाइड है: थॉटबोट.
विदा

57

यदि आप चाहते हैं ImageViewकि उचित पहलू अनुपात रखते हुए दोनों ऊपर और नीचे हों, तो इसे अपने XML में जोड़ें:

android:adjustViewBounds="true"
android:scaleType="fitCenter"

इसे अपने कोड में जोड़ें:

// We need to adjust the height if the width of the bitmap is
// smaller than the view width, otherwise the image will be boxed.
final double viewWidthToBitmapWidthRatio = (double)image.getWidth() / (double)bitmap.getWidth();
image.getLayoutParams().height = (int) (bitmap.getHeight() * viewWidthToBitmapWidthRatio);

इस कार्य को करने में मुझे थोड़ा समय लगा, लेकिन यह उन मामलों में काम करता है, जहां छवि स्क्रीन की चौड़ाई से छोटी और स्क्रीन की चौड़ाई से बड़ी है, और यह छवि को बॉक्स में नहीं रखती है।


1
क्यों न केवल Android का उपयोग करें: scaleType = "centerCrop"?
लुकास बट्टेऊ

एक आकर्षण की तरह काम करता है, धन्यवाद। scaleType स्थिति पर निर्भर करता है, उदाहरण के लिए मुझे इसकी बिल्कुल आवश्यकता है।
डेविड

यह दृश्य को आकार देने का एक छोटा सा बर्बर तरीका है। यदि आप ImageView के लिए बिटमैप सेट करने के बाद दृश्य सीमा बदलते हैं तो क्या होता है? यह ऐसा क्यों किया जाना चाहिए यह ऑनमार्ट () में है, जिसे यदि आप ImageView का कस्टम उपवर्ग बनाते हैं तो इसे लागू किया जा सकता है।
एरन लोरिंज़

1
मुझे जो कुछ चाहिए था वह था फिटकेंटर और एडजस्ट व्यूबाउंड्स, बाकी कोड मेरे लिए कम से कम अनावश्यक था
किंगरगेल

यह मेरे लिए काम करता है और किसी भी कोड को जोड़ने की आवश्यकता नहीं है। AdjustViewBounds के बिना अगर छवि की चौड़ाई imageView चौड़ाई से छोटी थी, तो यह स्केलिंग नहीं थी, इसलिए ऊंचाई देशी ऊंचाई पर रोक रही थी और चौड़ाई पर कुछ बैंड दिखाई दिए।
Cristi Băluță

15

यह मेरे लिए काम किया:

android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxWidth="39dip"
android:scaleType="centerCrop"
android:adjustViewBounds ="true"


9

पहलू अनुपात के रूप में स्केल छवि के लिए कोड नीचे काम कर रहा है:

Bitmap bitmapImage = BitmapFactory.decodeFile("Your path");
int nh = (int) ( bitmapImage.getHeight() * (512.0 / bitmapImage.getWidth()) );
Bitmap scaled = Bitmap.createScaledBitmap(bitmapImage, 512, nh, true);
your_imageview.setImageBitmap(scaled);

8

जिस तरह से आकार परिवर्तन होता है उसे नियंत्रित करने और समझने के लिए ImageView.ScaleType पर एक नज़र डालें ImageView। जब छवि को आकार दिया जाता है (इसके पहलू अनुपात को बनाए रखते हुए), तो संभावना यह है कि या तो छवि की ऊंचाई या चौड़ाई छोटे ImageViewआयामों से छोटी हो जाती है ।


6

पहलू अनुपात रखने के लिए ImageView में इन गुणों का उपयोग करें:

android:adjustViewBounds="true"
android:scaleType="fitXY"

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

केवल इस जवाब ने मेरी मदद की। धन्यवाद!
दिमित्री

6

यह इस तरह से मेरे लिए एक कांस्ट्रेन्थलाईट के अंदर काम कर गया:

<ImageView
    android:id="@+id/myImg"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:scaleType="fitCenter"
    android:adjustViewBounds="true"/>

फिर कोड में, मैंने ड्रॉबल को इस प्रकार सेट किया:

ImageView imgView = findViewById(R.id.myImg);
imgView.setImageDrawable(ResourcesCompat.getDrawable(getResources(), R.drawable.image_to_show, null));

यह छवि को इसके पहलू अनुपात के अनुसार अच्छी तरह से फिट बैठता है और इसे केंद्र में रखता है।


5

मेरी स्क्रीन से छोटी छवि है। इसे अधिकतम करने के लिए आनुपातिक रूप से बढ़ा दिया गया है और इसे देखने के लिए मुझे निम्नलिखित कोड का उपयोग करना होगा:

<ImageView
    android:id="@+id/my_image"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_centerInParent="true"
    android:adjustViewBounds="true"
    android:layout_weight="1"
    android:scaleType="fitCenter" />

हालांकि, ध्यान रखें कि यदि आपके पास एक रिश्तेदार लेआउट है और कुछ तत्व ImageView के ऊपर या नीचे होने के लिए सेट हैं, तो वे छवि द्वारा ओवरलैप होने की सबसे अधिक संभावना होगी।


4

यदि छवि गुणवत्ता घट जाती है: उपयोग करें

android:adjustViewBounds="true"

के बजाय

android:adjustViewBounds="true"
android:scaleType="fitXY"

3

आप में से किसी के लिए जो छवि को उचित स्केलिंग और कोई क्रॉपिंग उपयोग के साथ छवि को सटीक रूप से फिट करना चाहता है

imageView.setScaleType(ScaleType.FIT_XY);

जहाँ imageView आपके ImageView का प्रतिनिधित्व करने वाला दृश्य है


4
नहींं, यह पहलू राशन को बदल देता है। डॉक्स कहते हैं: "एक्स और वाई में स्वतंत्र रूप से स्केल, ताकि src बिल्कुल dst से मेल खाता हो। यह src के पहलू अनुपात को बदल सकता है।"
रोज पेरोन

वैसे, इस FIT_XY का उपयोग इमेजव्यू पर प्रदर्शित करने के लिए छवि की चौड़ाई / ऊंचाई को बदलने के लिए नहीं किया जा सकता है।
बे

3

आप स्क्रीन की चौड़ाई की गणना कर सकते हैं। और आप बिटमैप को स्केल कर सकते हैं।

 public static float getScreenWidth(Activity activity) {
        Display display = activity.getWindowManager().getDefaultDisplay();
        DisplayMetrics outMetrics = new DisplayMetrics();
        display.getMetrics(outMetrics);
        float pxWidth = outMetrics.widthPixels;
        return pxWidth;
    }

स्क्रीन चौड़ाई द्वारा स्क्रीन चौड़ाई और स्केल की गई छवि ऊंचाई की गणना करें।

float screenWidth=getScreenWidth(act)
  float newHeight = screenWidth;
  if (bitmap.getWidth() != 0 && bitmap.getHeight() != 0) {
     newHeight = (screenWidth * bitmap.getHeight()) / bitmap.getWidth();
  }

बाद आप बिटमैप को स्केल कर सकते हैं।

Bitmap scaledBitmap=Bitmap.createScaledBitmap(bitmap, (int) screenWidth, (int) newHeight, true);

3

इस कार्यक्रम को करते समय, सही क्रम में बसने वालों को कॉल करना सुनिश्चित करें:

imageView.setAdjustViewBounds(true)
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP)

2

यदि आप चाहते हैं कि आपकी छवि अधिकतम संभव स्थान पर कब्जा कर ले तो सबसे अच्छा विकल्प होगा

android:layout_weight="1"
android:scaleType="fitCenter"

2

यो को किसी जावा कोड की आवश्यकता नहीं है। बस तुम्हें यह करना होगा :

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

कुंजी चौड़ाई और ऊंचाई के लिए मैच पैरेंट में है


1

android:layout_gravityImageView के लिए उपयोग करने का प्रयास करें :

android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_weight="1"

ऊपर दिए गए उदाहरण ने मेरे लिए काम किया।


1
एंड्रॉइड: लेआउट_वेट = "1" कुंजी है।
निमा

1

मेरे पास अपने आयाम अनुपात को बनाए रखने के लिए कंटेनर आयामों को सर्वश्रेष्ठ करने के लिए बिटमैप को स्केल करने के लिए एक एल्गोरिदम है। कृपया यहां मेरा समाधान खोजें

आशा है कि यह किसी को नीचे लेन में मदद करता है!


0

मैं इसका उपयोग करता हूं:

<ImageView
android:id="@+id/logo"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:scaleType="centerInside"
android:src="@drawable/logo" />

0

cardviewराउंडिंग के लिए उपयोग करने के मामले में imageviewऔर android:layout_heightहेडर के लिए तय यह मेरे लिए छवि को लोड करने के लिए काम करता हैGlide

    <?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             xmlns:tools="http://schemas.android.com/tools"
             android:layout_width="match_parent"
             android:layout_height="220dp"
             xmlns:card_view="http://schemas.android.com/apk/res-auto"
             >

    <android.support.v7.widget.CardView
            android:id="@+id/card_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center|top"
            card_view:cardBackgroundColor="@color/colorPrimary"
            card_view:cardCornerRadius="10dp"
            card_view:cardElevation="10dp"
            card_view:cardPreventCornerOverlap="false"
            card_view:cardUseCompatPadding="true">

        <ImageView
                android:adjustViewBounds="true"
                android:maxHeight="220dp"
                android:id="@+id/iv_full"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="fitCenter"/>

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

0

आप छवि को स्केल कर सकते हैं जो आपकी छवि के आकार को भी कम करेगा। इसके लिए एक पुस्तकालय है जिसे आप डाउनलोड कर सकते हैं और इसका उपयोग कर सकते हैं। https://github.com/niraj124124/Images-Files-scale-and-compress.git

1 का उपयोग कैसे करें) कंप्रेसर-v1.0 आयात करें। अपने प्रोजेक्ट के लिए जार। 2) परीक्षण करने के लिए नीचे नमूना कोड जोड़ें। ResizeLimiter resize = ImageResizer.build (); resize.scale ("inputImagePath", "outputImagePath", imageWidth, imageHeight); आपकी आवश्यकता के अनुसार कई और तरीके हैं


0

अपना ImageView पास करें और स्क्रीन की ऊँचाई और चौड़ाई के आधार पर आप इसे बना सकते हैं

    public void setScaleImage(EventAssetValueListenerView view){
        // Get the ImageView and its bitmap
        Drawable drawing = view.getDrawable();
        Bitmap bitmap = ((BitmapDrawable)drawing).getBitmap();
        // Get current dimensions
        int width = bitmap.getWidth();
        int height = bitmap.getHeight();

        float xScale = ((float) 4) / width;
        float yScale = ((float) 4) / height;
        float scale = (xScale <= yScale) ? xScale : yScale;

        Matrix matrix = new Matrix();
        matrix.postScale(scale, scale);

        Bitmap scaledBitmap = Bitmap.createBitmap(bitmap, 0, 0, width, height, matrix, true);
        BitmapDrawable result = new BitmapDrawable(scaledBitmap);
        width = scaledBitmap.getWidth();
        height = scaledBitmap.getHeight();

        view.setImageDrawable(result);

        LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) view.getLayoutParams();
        params.width = width;
        params.height = height;
        view.setLayoutParams(params);
    }


0

शीघ्र जवाब:

<ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="center"
        android:src="@drawable/yourImage"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

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