Android: Skala gambar yang Dapat Digambar atau latar belakang?

Pada tata letak saya ingin skala gambar latar belakang (menjaga rasio aspeknya) ke ruang yang dialokasikan ketika halaman dibuat. Adakah yang punya ide bagaimana melakukan ini?

Saya menggunakan layout.setBackgroundDrawable()dan BitmapDrawable()untuk mengatur gravitykliping dan mengisi, tetapi tidak melihat opsi untuk penskalaan.

Untuk menyesuaikan penskalaan gambar latar belakang buat sumber daya seperti ini:

<?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" />

Maka akan berpusat pada tampilan jika digunakan sebagai latar belakang. Ada juga flag lain: http://developer.android.com/guide/topics/resources/drawable-resource.html

Belum mencoba melakukan persis apa yang Anda inginkan, tetapi Anda dapat skala menggunakan ImageView android:scaleType="fitXY"
dan itu akan berukuran sesuai dengan ukuran apa pun yang Anda berikan ImageView.

Jadi Anda bisa membuat FrameLayout untuk tata letak Anda, letakkan ImageView di dalamnya, dan kemudian konten apa pun yang Anda butuhkan di FrameLayout juga dengan latar belakang transparan.

<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>

Ada cara mudah untuk melakukan ini dari drawable:

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>

Satu-satunya downside adalah bahwa jika tidak ada cukup ruang, gambar Anda tidak akan sepenuhnya ditampilkan, tetapi akan terpotong, saya tidak bisa menemukan cara untuk melakukan ini secara langsung dari yang dapat digambar. Tetapi dari pengujian saya berhasil dengan cukup baik, dan itu tidak memotong banyak gambar. Anda bisa bermain lebih banyak dengan opsi gravitasi.

Cara lain adalah dengan hanya membuat tata letak, di mana Anda akan menggunakan ImageViewdan mengatur scaleTypeuntuk fitCenter.

Untuk mempertahankan rasio aspek yang harus Anda gunakan android:scaleType=fitCenteratau fitStartdll. Menggunakan fitXYtidak akan menjaga rasio aspek asli gambar!

Perhatikan ini hanya berfungsi untuk gambar dengan srcatribut, bukan untuk gambar latar belakang.

Gunakan gambar sebagai ukuran latar belakang untuk tata letak:

<?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>

Saat Anda mengatur Drawable of ImageView dengan menggunakan setBackgroundDrawablemetode ini, gambar akan selalu diskalakan. Parameter sebagai adjustViewBoundsatau berbeda ScaleTypeshanya akan diabaikan. Satu-satunya solusi untuk menjaga aspek rasio yang saya temukan, adalah mengubah ukuran ImageViewsetelah memuat gambar Anda. Berikut ini cuplikan kode yang saya gunakan:

// 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);

Dalam cuplikan kode di atas adalah bmp objek Bitmap yang akan ditampilkan dan imageView adalah ImageViewobjek

Yang penting untuk diperhatikan adalah perubahan parameter tata letak . Ini perlu karena setMaxHeightdan setMaxWidthhanya akan membuat perbedaan jika lebar dan tinggi didefinisikan untuk membungkus konten, bukan untuk mengisi induknya. Isi induk di sisi lain adalah pengaturan yang diinginkan di awal, karena jika tidak containerWidthdan containerHeightkeduanya akan memiliki nilai sama dengan 0. Jadi, dalam file tata letak Anda, Anda akan memiliki sesuatu seperti ini untuk ImageView Anda:

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

Ini bukan solusi yang paling performan, tetapi sebagai seseorang menyarankan daripada latar belakang Anda dapat membuat FrameLayout atau RelativeLayout dan menggunakan ImageView sebagai latar belakang semu - elemen lain akan berada tepat di atasnya:

<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>

Masalah dengan ImageView adalah bahwa hanya scaleTypes yang tersedia adalah: 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 )

dan untuk "skala gambar latar (menjaga rasio aspeknya)" dalam beberapa kasus, ketika Anda ingin gambar untuk mengisi seluruh layar (misalnya gambar latar belakang) dan rasio aspek layar berbeda dari gambar, skala yang diperlukanTipe dari TOP_CROP, karena:

CENTER_CROP menempatkan gambar berskala tengah alih-alih menyejajarkan tepi atas ke tepi atas tampilan gambar dan FIT_START sesuai dengan ketinggian layar dan tidak memenuhi lebar. Dan seperti yang diketahui pengguna, FIT_XY tidak mempertahankan rasio aspek.

Dengan senang hati seseorang telah memperluas ImageView untuk mendukung 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

Sekarang IMHO akan sempurna jika seseorang menulis Drawable kustom yang skala gambarnya seperti itu. Kemudian bisa digunakan sebagai parameter latar belakang.

Reflog menyarankan untuk mengatur skala drawable sebelum menggunakannya. Berikut ini instruksi cara melakukannya: Java (Android): Bagaimana skala gambar yang dapat digambar tanpa Bitmap? Meskipun memiliki kekurangan, drawable / bitmap yang ditingkatkan akan menggunakan lebih banyak RAM, sementara scaling on the fly yang digunakan oleh ImageView tidak memerlukan lebih banyak memori. Keuntungannya bisa lebih sedikit beban prosesor.

Kode di bawah ini membuat bitmap sempurna dengan ukuran imageview yang sama. Dapatkan tinggi dan lebar gambar bitmap lalu hitung tinggi dan lebar baru dengan bantuan parameter imageview. Itu memberi Anda gambar yang diperlukan dengan rasio aspek terbaik.

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)

Apa yang Dweebo usulkan berhasil. Tetapi menurut pendapat saya yang sederhana itu tidak perlu. Latar belakang dapat digambar dengan baik dengan sendirinya. Tampilan harus memiliki lebar dan tinggi tetap, seperti dalam contoh berikut:

 < 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>

Satu opsi untuk dicoba adalah dengan meletakkan gambar di drawable-nodpi folder dan mengatur latar belakang tata letak ke id sumber daya yang dapat digambar.

Ini pasti bekerja dengan scaling down, saya belum menguji dengan scaling up sekalipun.

Kotlin:

Jika Anda perlu menggambar bitmap di Tampilan, diskalakan ke FIT.

Anda dapat melakukan perhitungan yang tepat untuk mengatur bm tinggi sama dengan wadah dan menyesuaikan lebar, dalam hal bm rasio lebar terhadap tinggi kurang dari rasio lebar kontainer terhadap tinggi, atau kebalikan dalam skenario yang berlawanan.

Gambar-gambar:

// 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())
}

Anda harus melakukan pra-skala gambar yang dapat digambar sebelum menggunakannya sebagai latar belakang

Anda dapat menggunakan salah satu dari berikut ini:

android: gravity = "fill_horizontal | clip_vertical"

Atau

android: gravity = "fill_vertical | clip_horizontal"