Search code examples
androidandroid-layoutandroid-studioscreen-orientationscreen-resolution

Android Image Scaling according to device


In the process of designing the login page for my application i noticed that the images on my main page vary according to the screen (which it should) however i sometimes get a distorted look or an overlapping look. Going through various articles on google on similar topic the suggestion was to place images of different dimension in sub folders of drawable (hdpi, mdpi,xhdpi,xxhdpi) and some even suggested that placing a single image in the no-hdpi folder should play the trick. Could somebody please guide me to the right track and also let me know how can i get images of various dimensions (hdpi, mdpi,xhdpi,xxhdpi) from the main image which is 1024*720 px in size.

Below is my main layout. I have a button, image view and image button. What i want is there should be no gaps / separation between the image view and image button . The button comes over the Image view( that works fine).

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
    <Button
        android:id="@+id/about"
        android:background="@android:color/transparent"
        android:src="@drawable/download"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="centerCrop"
        android:textSize="15sp"
        android:adjustViewBounds="true"
        android:paddingTop="-5dp"
        android:text="About"
        android:linksClickable="true"
        android:layout_alignParentLeft="true"
        android:textAlignment="center"
        android:textColor="@color/orangered"/>

    <ImageView
        android:id="@+id/C_image_view"
        android:src="@drawable/kamakshi"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

        android:scaleType="centerCrop"
        android:layout_weight="5"/>
     <ImageButton
        android:id="@+id/download"
        android:src="@drawable/download"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/about"
         android:layout_alignParentBottom="true"
        android:scaleType="centerCrop"
         android:layout_weight="5"
        />

</RelativeLayout>

Solution

  • Could somebody please guide me to the right track and also let me know how can i get images of various dimensions (hdpi, mdpi,xhdpi,xxhdpi) from the main image which is 1024*720 px in size.
    

    You can use Android Drawable Importer plugin for Android Studio. I use the same for importing resources.