Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Please help to design the layout with attached image in Android

    • 0
    • 0
    • 0
    • 2
    • 0
    • 1
    • 0
    • 1.09k
    Answer it

    Please help in design the layout with attached image. please find the attached screen shot for reference

    Suggest whether we go with grid layout or Relative layout . Please provide the respective xml layout.

    If you suggest grid layout could you please provide the UI and help to perform onclick listener to navigate respective activity from this grid layout.

    thanks in advance

    Please help to  design the layout with attached image in Android

 2 Answer(s)

  • Create a shape in drawable folder like

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
      android:shape="rectangle">
      <corners
        android:radius="10dip"/>
      <solid
        android:color="#F00" />
      <stroke
        android:width="2dip"
        android:color="#FFF" />
      <padding
        android:left="5dip"
        android:right="5dip"
        android:top="5dip"
        android:bottom="5dip" />
    </shape>
    

    Now create a Text view in your xml file and set its background to the above shape created.

    <TextView
      android:layout&#95;width="wrap&#95;content"
      android:layout&#95;height="wrap&#95;content" 
      android:text="10"
      android:textColor="#FFF"
      android:textSize="16sp"
      android:textStyle="bold"
      android:background="@drawable/badge&#95;circle"/>
    

    This will give the effect of text view with red color background now set this to the corner of any view like button or text etc.

    EX.

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout&#95;width="wrap&#95;content"
      android:layout&#95;height="wrap&#95;content">
      <Button
        android:id="@+id/myButton"
        android:layout&#95;width="65dip"
        android:layout&#95;height="65dip"/>
      <TextView
        android:id="@+id/textOne"
        android:layout&#95;width="wrap&#95;content"
        android:layout&#95;height="wrap&#95;content"
        android:layout&#95;alignTop="@id/myButton"
        android:layout&#95;alignRight="@id/myButton" 
        android:text="10"
        android:textColor="#FFF"
        android:textSize="16sp"
        android:textStyle="bold"
        android:background="@drawable/badge&#95;circle"/>
    </RelativeLayout>
    

    Please replace &#95; with _ from the code, also If answers is helpful please mark the answer correct ! Happy coding :)

  • Add rounder corners to both textview

    <FrameLayout
                android:id="@+id/profile&#95;pic&#95;frame"
                android:layout&#95;width="wrap&#95;content"
                android:layout&#95;height="wrap&#95;content"
                android:layout&#95;centerHorizontal="true"
                android:layout&#95;gravity="center&#95;horizontal">
    
                <TextView xmlns:app="http://schemas.android.com/apk/res-auto"
                    android:id="@+id/profile&#95;image"
                    android:layout&#95;width="110dp"
                    android:layout&#95;height="110dp"
                    android:layout&#95;marginTop="@dimen/dp&#95;20"
                    android:src="@drawable/default&#95;profile&#95;photo"
                    android:background="@android:color/black"
                     />
    
                <TextView
                    android:id="@+id/img&#95;driver&#95;signup&#95;select&#95;image"
                    android:layout&#95;width="40dp"
                    android:layout&#95;height="40dp"
                    android:textColor="@android:color/white"
                    android:text="5"
                    android:gravity="center"
                    android:layout&#95;gravity="top|end|right"
                    android:background="@android:color/holo&#95;red&#95;dark"></TextView>
    
            </FrameLayout>
    
Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: