Ok, so, I have read a lot about creating layout for android devices. I thought I was on the right path when I wasnt. My situation is next:
I created layout-normal, layout-normal-land, layout-small, layout-small-land, etc... Then, I got values-normal-ldpi, values-normal-mdpi, and all the other qualifiers. I put the dimensions in those folders and in my layout, I use just them. Here is my layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#e8e8e8"
android:orientation="vertical">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/toolbarMainScreen"
android:layout_width="match_parent"
android:layout_height="@dimen/visinaHeadera"
android:background="#1d6cb5"
android:minHeight="?attr/actionBarSize"
android:theme="@style/Widget.AppCompat.Toolbar">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="@drawable/senkaokoikonica"
android:scaleType="center"
android:src="@drawable/homeicon" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/razmakOdHomeDoTexta"
android:layout_weight="1"
android:paddingTop="@dimen/marginaTextaZaIspisuHeaderu"
android:text="Akcije i katalozi"
android:textAlignment="center"
android:textColor="#ffffff"
android:textSize="15sp"
android:typeface="sans" />
<ImageButton
android:id="@+id/imageButtonOtvoriSearch"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/search_klik"
android:scaleType="center"
android:src="@drawable/searchicon" />
<View
android:layout_width="@dimen/razmakIzmedjuLupeIShare"
android:layout_height="match_parent" />
<ImageButton
android:id="@+id/shareButtonKataloziMainScreen"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/senkaokoikonica"
android:scaleType="center"
android:src="@drawable/shareicon" />
<View
android:layout_width="@dimen/razmakIzmedjuLupeIShare"
android:layout_height="match_parent" />
<ImageButton
android:id="@+id/settingsButtonMainScreen"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/senkaokoikonica"
android:scaleType="center"
android:src="@drawable/settingsicon" />
<View
android:layout_width="@dimen/razmakIzmedjuSettingsIDesnogKraja"
android:layout_height="match_parent" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="3.33dp"
android:layout_below="@+id/toolbarMainScreen"
android:background="@drawable/headshad480" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="3.33dp"
android:layout_below="@+id/linearLayoutZaSearchMainScreen"
android:background="@drawable/headshad480"
android:visibility="invisible" />
<LinearLayout
android:id="@+id/linearLayoutZaSearchMainScreen"
android:layout_width="match_parent"
android:layout_height="@dimen/visinaDrugogHeadera"
android:layout_below="@+id/toolbarMainScreen"
android:background="@drawable/searchbg"
android:orientation="horizontal"
android:visibility="invisible">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@drawable/searchbg">
<EditText
android:id="@+id/editTextMainScreen"
android:layout_width="match_parent"
android:layout_height="@dimen/editTextSearchVisina"
android:layout_marginBottom="@dimen/editTextMarginaBot"
android:layout_marginLeft="@dimen/editTextMarginaLeft"
android:layout_marginRight="@dimen/editTextMarginaRight"
android:layout_marginTop="@dimen/editTextMarginaTop"
android:layout_weight="1"
android:background="@drawable/edittext_conrer"
android:hint="Pretraga"
android:textColor="#000000"
android:textColorHint="#000000"
android:textStyle="italic" />
</LinearLayout>
<ImageButton
android:id="@+id/imageButtonSearch"
android:layout_width="wrap_content"
android:layout_height="@dimen/searchButtSearchVisina"
android:layout_gravity="right"
android:layout_marginBottom="@dimen/searchButtMarginaBot"
android:layout_marginRight="@dimen/searchButtMarginaRight"
android:layout_marginTop="@dimen/searchButtMarginaTop"
android:background="@drawable/search_klik"
android:scaleType="center"
android:src="@drawable/searchiconkrug" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_above="@+id/linearLayoutZaReklameMainScreen"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="@+id/toolbarMainScreen"
android:layout_weight="1"
android:baselineAligned="false"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageButton
android:id="@+id/buttonProdavci"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="@dimen/marginIzmedjuSlika"
android:layout_marginLeft="@dimen/marginIzmedjuSlikaIZida"
android:layout_marginRight="@dimen/marginIzmedjuSlika"
android:layout_marginTop="@dimen/marginTopZaGornjeSlike"
android:layout_weight="1"
android:background="@drawable/prodavci"
android:scaleType="center" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageButton
android:id="@+id/buttonProizvodi"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="@dimen/marginIzmedjuSlika"
android:layout_marginLeft="@dimen/marginIzmedjuSlika"
android:layout_marginRight="@dimen/marginIzmedjuSlikaIZida"
android:layout_marginTop="@dimen/marginTopZaGornjeSlike"
android:layout_weight="1"
android:background="@drawable/proizvodi"
android:scaleType="center" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageButton
android:id="@+id/buttonBarkod"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="@dimen/marginIzmedjuSlikaIZida"
android:layout_marginLeft="@dimen/marginIzmedjuSlikaIZida"
android:layout_marginRight="@dimen/marginIzmedjuSlika"
android:layout_marginTop="@dimen/marginIzmedjuSlika"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="@drawable/barcode"
android:scaleType="center" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageButton
android:id="@+id/buttonSviKatalozi"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerHorizontal="true"
android:layout_marginBottom="@dimen/marginIzmedjuSlikaIZida"
android:layout_marginLeft="@dimen/marginIzmedjuSlika"
android:layout_marginRight="@dimen/marginIzmedjuSlikaIZida"
android:layout_marginTop="@dimen/marginIzmedjuSlika"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="@drawable/svikatalozi"
android:scaleType="center" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/linearLayoutZaReklameMainScreen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center|bottom">
<com.google.android.gms.ads.AdView
android:id="@+id/adViewMainScreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_gravity="bottom|center"
ads:adSize="BANNER"
ads:adUnitId="@string/aik_ad_unit_id"></com.google.android.gms.ads.AdView>
</LinearLayout>
<LinearLayout
android:id="@+id/lejoutZaTransparentonstMainScreen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_below="@id/toolbarMainScreen"
android:alpha=".35"
android:background="#000000"
android:orientation="horizontal"
android:visibility="invisible" />
</RelativeLayout>
Still, when I test it on my device(Samsung Galaxy s2 plus) it looks very good. WHen I test it on Nexus 5, it doesnt look even close.
Any suggestions on how to create adequate number of layout for the best solution for phones and tablets?
You can use these layouts to support all screen sizes:
layout # For handsets (smaller than 600dp available width)
layout-sw600dp # For 7” tablets (600dp wide and bigger)
layout-sw720dp # For 10” tablets (720dp wide and bigger)