Arash
Arash

Reputation: 3071

ImageViews accurate Position In Multiple Screens

I want red and green pin in the picture be exactly Like the picture in Nexus 4 (Top-left screen) in all screens.i read similar pages and also read http://developer.android.com/guide/practices/screens_support.html and i know i can solve this with layout-large,layout-xlarge,etc but i have 40 layout like this and if i make each of them for different screens it comes(40*4) 160 layout!

enter image description here

Here is the XML Layout :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/outlineLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<ImageView
    android:id="@+id/arrowleft"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="107dp"
    android:scaleType="fitCenter"
    android:src="@drawable/arrowleft" />

<ImageView
    android:id="@+id/greenpin"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignRight="@+id/imageView1"
    android:layout_alignTop="@+id/img_start"
    android:src="@drawable/greenpin" />

<ImageView
    android:id="@+id/redpin"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/imageView1"
    android:layout_centerVertical="true"
    android:scaleType="centerCrop"
    android:src="@drawable/redpin" />

  </RelativeLayout>

Upvotes: 2

Views: 134

Answers (2)

Varun Vishnoi
Varun Vishnoi

Reputation: 990

Use following layout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:id="@+id/outlineLayout"
 android:layout_width="match_parent"
 android:layout_height="match_parent">

 <ImageView
  android:id="@+id/imageView1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_centerVertical="true"
  android:src="@drawable/arrowleft" />

<ImageView
  android:id="@+id/imageView2"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_centerVertical="true"
  android:layout_toRightOf="@+id/imageView1"
  android:src="@drawable/greenpin" />

<ImageView
  android:id="@+id/img_start"
  android:layout_toLeftOf="@+id/imageView1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_centerVertical="true"
  android:src="@drawable/redpin" />

 </RelativeLayout>

You can add your other tags according to need, however from above logic you can align all three images as you want.

Happy Coding

Upvotes: 1

dipali
dipali

Reputation: 11188

please android:layout_marginTop="107dp" line in all dimension file of all specific device.

for ex. values-large -> dimens.xml ->add this line android:layout_marginTop="107dp"

values-sw600dp -> dimens.xml ->add this line android:layout_marginTop="97dp"

put only 1 layout folder and multiple valaues folder.

i hope this is useful to you..

Upvotes: 0

Related Questions