Showing posts with label screens. Show all posts
Showing posts with label screens. Show all posts

Thursday, 25 December 2014

Color shade effects designing in android

Today i am going to post about color shade designing in android with using XML.

You can download necessary files for this example from HEAR.


In this there is no need to Add anything in java file, you can design by XML file only.

activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.AndroidTecHub.colorshade.MainActivity" >
   
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="5"
        android:weightSum="9">
       
        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:background="@drawable/one_shade">
           
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="1"
                android:textSize="55dp"
                android:layout_gravity="center"/>
           
        </FrameLayout>
        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:background="@drawable/two_shade">
           
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="2"
                android:textSize="55dp"
                android:layout_gravity="center"/>
           
        </FrameLayout>
        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:background="@drawable/three_shade">
           
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="3"
                android:textSize="55dp"
                android:layout_gravity="center"/>
           
        </FrameLayout>
       
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="5">
       
        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:background="@drawable/four_shade">
           
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="4"
                android:textSize="55dp"
                android:layout_gravity="center"/>
           
        </FrameLayout>
        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:background="@drawable/five_shade">
           
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="5"
                android:textSize="55dp"
                android:layout_gravity="center"/>
           
        </FrameLayout>
        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:background="@drawable/six_shade">
           
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="6"
                android:textSize="55dp"
                android:layout_gravity="center"/>
           
        </FrameLayout>
       
    </LinearLayout>




</LinearLayout>




Hear is one of the drawable xml file for example,You can download all file from download link.

one_shad.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item >
    <shape android:shape="rectangle"  >
         <gradient android:angle="-90" android:startColor="#FF0000" android:endColor="#FFFFFF" />           
     </shape>
 </item>
</selector>



You can download necessary files for this example from HEAR.

I hope it will help you in developing android app.
Happy coding...

Thursday, 11 December 2014

Android Set textsize for Multiple Screens


There is main issue in android to design your application in a way to application should look proper in all devices whether it will small size device or it will tablet, So Today I am going to Explain How to design your application For different size of devices.

Step - 1:
First Create New Sample application,

For Create New Application in Eclipse go to

File-> New-> Android Application Project



Now Press Next...Finish.


 Step - 2:
Set "res" Folder,

Create new 4 folders in "Package Explorer -> YourApp -> res" folder,with name  
  • values-small
  • values-normal,
  • values-large
  • values-xlarge

(Note : if you cant get find Package Explorer then go to in Menu bar
"Window -> Show View -> Package Explorer")

 Now Create XML file in all this 4 new folders with same name "dimens.xm".




Step - 3 :
Set TextSize of Textview:

Now Let we set on size of font for different devices using by calling values from dimens.xml file.

Open Your main design xml page from Layout folder.and take one textview
and call text size from dimens.xml file as give in below.


Yes,It will give an error when we set "textsize" in textview because we trying to fetch value of textsize from dimen.xml but we are still not define value in dimens.xml,So let we define it in all dimens files.

Step - 4:
define TextSize in all dimens.xml:

 now set values of textsize in dimens file,

For "values-small -> dimens.xml" use below code,
<dimen name="textsize">16dp</dimen>

For "values-normal -> dimens.xml" use below code,
<dimen name="textsize">20dp</dimen>

For "values-large -> dimens.xml" use below code,
<dimen name="textsize">35dp</dimen>

For "values-xlarge -> dimens.xml" use below code,
<dimen name="textsize">55dp</dimen>




Thats it!!!!
Now when you can check your output for all devices it will look appropriately for all devices .

By this way devices will fetch textsize from dimens.xml.

 Device Size
  • For devices of size < 2.7" fatch vaues from values-small
  • For devices of size  3.2" to 4.7" fatch vaues from values-normal folder
  • For devices of size 5.1" to 7.0" fatch vaues from values-large folder
  • For 10" tablet fatch vaues from values-xlarge folder