Android: ปรับขนาดภาพวาดหรือพื้นหลัง?

ในเค้าโครงฉันต้องการปรับขนาดภาพพื้นหลัง (รักษาอัตราส่วนภาพ) ให้เท่ากับพื้นที่ที่จัดสรรเมื่อสร้างเพจ ใครมีความคิดในการทำเช่นนี้?

ฉันใช้layout.setBackgroundDrawable()และBitmapDrawable()ตั้งค่าgravityสำหรับการตัดและการเติม แต่ไม่เห็นตัวเลือกใด ๆ สำหรับการปรับขนาด

ในการปรับแต่งการปรับขนาดภาพพื้นหลังให้สร้างทรัพยากรดังนี้:

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:gravity="center"
    android:src="@drawable/list_bkgnd" />

จากนั้นจะอยู่ตรงกลางมุมมองหากใช้เป็นพื้นหลัง นอกจากนี้ยังมีแฟล็กอื่น ๆ : http://developer.android.com/guide/topics/resources/drawable-resource.html

ยังไม่ได้พยายามทำสิ่งที่คุณต้องการ แต่คุณสามารถปรับขนาด ImageView โดยใช้android:scaleType="fitXY"
และจะมีขนาดพอดีกับขนาดที่คุณให้ ImageView

ดังนั้นคุณสามารถสร้าง FrameLayout สำหรับเลย์เอาต์ของคุณใส่ ImageView ไว้ข้างในจากนั้นเนื้อหาอื่น ๆ ที่คุณต้องการใน FrameLayout รวมทั้งพื้นหลังโปร่งใส

<FrameLayout  
android:layout_width="fill_parent" android:layout_height="fill_parent">

  <ImageView 
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:src="@drawable/back" android:scaleType="fitXY" />

  <LinearLayout>your views</LinearLayout>
</FrameLayout>

มีวิธีง่ายๆในการทำสิ่งนี้จากสิ่งที่วาดได้:

your_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:drawable="@color/bg_color"/>
    <item>
        <bitmap
            android:gravity="center|bottom|clip_vertical"
            android:src="@drawable/your_image" />
    </item>

</layer-list>

ข้อเสียเพียงอย่างเดียวคือหากมีพื้นที่ไม่เพียงพอภาพของคุณจะไม่แสดงเต็มรูปแบบ แต่จะถูกตัดออกฉันไม่สามารถหาวิธีทำสิ่งนี้ได้โดยตรงจากสิ่งที่วาดได้ แต่จากการทดสอบฉันทำได้ค่อนข้างดีและไม่ได้ตัดภาพมากขนาดนั้น คุณสามารถเล่นได้มากขึ้นด้วยตัวเลือกแรงโน้มถ่วง

อีกวิธีหนึ่งที่จะเป็นเพียงแค่การสร้างรูปแบบที่คุณจะใช้ImageViewและการตั้งค่าไปscaleTypefitCenter

เพื่อรักษาอัตราส่วนที่คุณต้องใช้android:scaleType=fitCenterหรือfitStartอื่น ๆ การใช้fitXYจะไม่คงอัตราส่วนเดิมของภาพไว้!

หมายเหตุสิ่งนี้ใช้ได้เฉพาะกับรูปภาพที่มีsrcแอตทริบิวต์เท่านั้นไม่ใช่สำหรับภาพพื้นหลัง

ใช้ภาพเป็นขนาดพื้นหลังในการจัดวาง:

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

    <ImageView
        android:id="@+id/imgPlaylistItemBg"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:adjustViewBounds="true"
        android:maxHeight="0dp"
        android:scaleType="fitXY"
        android:src="@drawable/img_dsh" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >


    </LinearLayout>

</FrameLayout>

เมื่อคุณตั้งค่า Drawable ของ ImageView โดยใช้setBackgroundDrawableวิธีนี้ภาพจะถูกปรับขนาดเสมอ พารามิเตอร์ที่เป็นadjustViewBoundsหรือต่างกันScaleTypesจะถูกละเว้น ทางออกเดียวที่จะรักษาอัตราส่วนภาพที่ฉันพบคือการปรับขนาดImageViewหลังจากโหลดที่ดึงได้ นี่คือข้อมูลโค้ดที่ฉันใช้:

// bmp is your Bitmap object
int imgHeight = bmp.getHeight();
int imgWidth = bmp.getWidth();
int containerHeight = imageView.getHeight();
int containerWidth = imageView.getWidth();
boolean ch2cw = containerHeight > containerWidth;
float h2w = (float) imgHeight / (float) imgWidth;
float newContainerHeight, newContainerWidth;

if (h2w > 1) {
    // height is greater than width
    if (ch2cw) {
        newContainerWidth = (float) containerWidth;
        newContainerHeight = newContainerWidth * h2w;
    } else {
        newContainerHeight = (float) containerHeight;
        newContainerWidth = newContainerHeight / h2w;
    }
} else {
    // width is greater than height
    if (ch2cw) {
        newContainerWidth = (float) containerWidth;
        newContainerHeight = newContainerWidth / h2w; 
    } else {
        newContainerWidth = (float) containerHeight;
        newContainerHeight = newContainerWidth * h2w;       
    }
}
Bitmap copy = Bitmap.createScaledBitmap(bmp, (int) newContainerWidth, (int) newContainerHeight, false);
imageView.setBackgroundDrawable(new BitmapDrawable(copy));
LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
imageView.setLayoutParams(params);
imageView.setMaxHeight((int) newContainerHeight);
imageView.setMaxWidth((int) newContainerWidth);

ในส่วนโค้ดด้านบนคือbmpอ็อบเจ็กต์ Bitmap ที่จะแสดงและimageViewคือImageViewอ็อบเจ็กต์

สิ่งสำคัญที่ควรทราบก็คือการเปลี่ยนแปลงของพารามิเตอร์รูปแบบที่ นี่เป็นสิ่งที่จำเป็นเพราะsetMaxHeightและsetMaxWidthจะสร้างความแตกต่างก็ต่อเมื่อมีการกำหนดความกว้างและความสูงเพื่อห่อเนื้อหาไม่ใช่เพื่อเติมเต็มแม่บท ในทางกลับกัน Fill parent คือการตั้งค่าที่ต้องการในตอนเริ่มต้นเพราะไม่เช่นนั้นcontainerWidthและcontainerHeightทั้งสองจะมีค่าเท่ากับ 0 ดังนั้นในไฟล์เลย์เอาต์ของคุณคุณจะมีสิ่งนี้สำหรับ ImageView ของคุณ:

...
<ImageView android:id="@+id/my_image_view"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"/>
...

นี่ไม่ใช่วิธีแก้ปัญหาที่มีประสิทธิภาพมากที่สุด แต่เนื่องจากมีคนแนะนำแทนที่จะเป็นพื้นหลังคุณสามารถสร้าง FrameLayout หรือ RelativeLayout และใช้ ImageView เป็นพื้นหลังหลอก - องค์ประกอบอื่น ๆ จะอยู่ในตำแหน่งเหนือมัน:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="match_parent"
    android:layout_width="match_parent">

    <ImageView
        android:id="@+id/ivBackground"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:scaleType="fitStart"
        android:src="@drawable/menu_icon_exit" />

    <Button
        android:id="@+id/bSomeButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="61dp"
        android:layout_marginTop="122dp"
        android:text="Button" />

</RelativeLayout>

ปัญหาเกี่ยวกับ ImageView คือมีเฉพาะ scaleTypes เท่านั้น: CENTER, CENTER_CROP, CENTER_INSIDE, FIT_CENTER, FIT_END, FIT_START, FIT_XY, MATRIX ( http://etcodehome.blogspot.de/2011/05/android-imageview-scaletype-samples.html )

และในการ "ปรับขนาดภาพพื้นหลัง (รักษาอัตราส่วนภาพ)" ในบางกรณีเมื่อคุณต้องการให้ภาพเต็มทั้งหน้าจอ (เช่นภาพพื้นหลัง) และอัตราส่วนของหน้าจอแตกต่างจากภาพขนาดมาตราส่วนที่จำเป็นจะเป็นชนิด ของ TOP_CROP เนื่องจาก:

CENTER_CROP จัดกึ่งกลางภาพที่ปรับขนาดแทนที่จะจัดแนวขอบด้านบนให้ชิดขอบด้านบนของมุมมองภาพและ FIT_START พอดีกับความสูงของหน้าจอและไม่เต็มความกว้าง และตามที่ผู้ใช้ Anke สังเกตว่า FIT_XY ไม่รักษาอัตราส่วน

ดีใจที่มีคนขยาย ImageView เพื่อรองรับ TOP_CROP

public class ImageViewScaleTypeTopCrop extends ImageView {
    public ImageViewScaleTypeTopCrop(Context context) {
        super(context);
        setup();
    }

    public ImageViewScaleTypeTopCrop(Context context, AttributeSet attrs) {
        super(context, attrs);
        setup();
    }

    public ImageViewScaleTypeTopCrop(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        setup();
    }

    private void setup() {
        setScaleType(ScaleType.MATRIX);
    }

    @Override
    protected boolean setFrame(int frameLeft, int frameTop, int frameRight, int frameBottom) {

        float frameWidth = frameRight - frameLeft;
        float frameHeight = frameBottom - frameTop;

        if (getDrawable() != null) {

            Matrix matrix = getImageMatrix();
            float scaleFactor, scaleFactorWidth, scaleFactorHeight;

            scaleFactorWidth = (float) frameWidth / (float) getDrawable().getIntrinsicWidth();
            scaleFactorHeight = (float) frameHeight / (float) getDrawable().getIntrinsicHeight();

            if (scaleFactorHeight > scaleFactorWidth) {
                scaleFactor = scaleFactorHeight;
            } else {
                scaleFactor = scaleFactorWidth;
            }

            matrix.setScale(scaleFactor, scaleFactor, 0, 0);
            setImageMatrix(matrix);
        }

        return super.setFrame(frameLeft, frameTop, frameRight, frameBottom);
    }

}

https://stackoverflow.com/a/14815588/2075875

ตอนนี้ IMHO จะสมบูรณ์แบบถ้ามีคนเขียน Drawable แบบกำหนดเองซึ่งจะปรับขนาดภาพเช่นนั้น จากนั้นสามารถใช้เป็นพารามิเตอร์พื้นหลัง

Reflog แนะนำให้วาดล่วงหน้าก่อนใช้งาน นี่คือคำแนะนำวิธีการทำ: Java (Android): วิธีการปรับขนาดที่วาดได้โดยไม่ต้องใช้ Bitmap แม้ว่าจะมีข้อเสีย แต่การขยายขนาด / บิตแมปที่ปรับขนาดได้จะใช้ RAM มากขึ้นในขณะที่การปรับขนาดได้ทันทีที่ใช้โดย ImageView ไม่ต้องการหน่วยความจำเพิ่มเติม ข้อได้เปรียบอาจเป็นภาระของโปรเซสเซอร์น้อยลง

โค้ดด้านล่างทำให้บิตแมปสมบูรณ์แบบด้วยขนาดเดียวกันของมุมมองภาพ รับความสูงและความกว้างของภาพบิตแมปจากนั้นคำนวณความสูงและความกว้างใหม่โดยใช้พารามิเตอร์ของ imageview ซึ่งจะทำให้คุณได้ภาพที่ต้องการโดยมีอัตราส่วนภาพที่ดีที่สุด

int bwidth=bitMap1.getWidth();
int bheight=bitMap1.getHeight();
int swidth=imageView_location.getWidth();
int sheight=imageView_location.getHeight();
new_width=swidth;
new_height = (int) Math.floor((double) bheight *( (double) new_width / (double) bwidth));
Bitmap newbitMap = Bitmap.createScaledBitmap(bitMap1,new_width,new_height, true);
imageView_location.setImageBitmap(newbitMap)

สิ่งที่ Dweebo เสนอได้ผล แต่ในความเห็นที่ต่ำต้อยของฉันมันไม่จำเป็น พื้นหลังสามารถปรับขนาดได้ดีด้วยตัวมันเอง มุมมองควรมีความกว้างและความสูงคงที่เช่นในตัวอย่างต่อไปนี้:

 < RelativeLayout 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@android:color/black">

    <LinearLayout
        android:layout_width="500dip"
        android:layout_height="450dip"
        android:layout_centerInParent="true"
        android:background="@drawable/my_drawable"
        android:orientation="vertical"
        android:padding="30dip"
        >
        ...
     </LinearLayout>
 < / RelativeLayout>

ทางเลือกหนึ่งที่ควรลองคือใส่รูปภาพในdrawable-nodpiโฟลเดอร์และตั้งค่าพื้นหลังของเค้าโครงเป็นรหัสทรัพยากรที่วาดได้

สิ่งนี้ใช้ได้ผลกับการลดขนาดอย่างแน่นอนฉันยังไม่ได้ทดสอบด้วยการขยายขนาด

Kotlin:

หากคุณต้องการวาดบิตแมปในมุมมองให้ปรับขนาดเป็น FIT

คุณสามารถทำการคำนวณที่เหมาะสมเพื่อกำหนด bm ให้มีความสูงเท่ากับคอนเทนเนอร์และปรับความกว้างในกรณีที่อัตราส่วนความกว้าง bm ต่อความสูงน้อยกว่าอัตราส่วนความกว้างของคอนเทนเนอร์ต่อความสูงหรือการผกผันในสถานการณ์ตรงกันข้าม

รูปภาพ:

// binding.fragPhotoEditDrawCont is the RelativeLayout where is your view
// bm is the Bitmap
val ch = binding.fragPhotoEditDrawCont.height
val cw = binding.fragPhotoEditDrawCont.width
val bh = bm.height
val bw = bm.width
val rc = cw.toFloat() / ch.toFloat()
val rb = bw.toFloat() / bh.toFloat()

if (rb < rc) {
    // Bitmap Width to Height ratio is less than Container ratio
    // Means, bitmap should pin top and bottom, and have some space on sides.
    //              _____          ___
    // container = |_____|   bm = |___| 
    val bmHeight = ch - 4 //4 for container border
    val bmWidth = rb * bmHeight //new width is bm_ratio * bm_height
    binding.fragPhotoEditDraw.layoutParams = RelativeLayout.LayoutParams(bmWidth.toInt(), bmHeight)
}
else {
    val bmWidth = cw - 4 //4 for container border
    val bmHeight = 1f/rb * cw
    binding.fragPhotoEditDraw.layoutParams = RelativeLayout.LayoutParams(bmWidth, bmHeight.toInt())
}

คุณจะต้องปรับขนาดล่วงหน้าที่วาดได้ก่อนที่จะใช้เป็นพื้นหลัง

คุณสามารถใช้สิ่งใดสิ่งหนึ่งต่อไปนี้:

หุ่นยนต์: แรงโน้มถ่วง = "fill_horizontal | clip_vertical"

หรือ

หุ่นยนต์: แรงโน้มถ่วง = "fill_vertical | clip_horizontal"