0

enter image description here

I want to create a layout like this and handle click event based on irregular sahpes. but I don't know how to do this any help would be appreciated.

Muhammad Zeshan
  • 104
  • 3
  • 13

1 Answers1

1

Using a RelativeLayout. Make sure the circle comes after the squares in the xml, so it'll be in front of them.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/holo_purple" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/centerLine"
    android:orientation="horizontal" >

    <ImageView
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginRight="2dp"
        android:layout_weight="1"
        android:src="@android:color/holo_orange_dark" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginLeft="2dp"
        android:layout_weight="1"
        android:src="@android:color/holo_green_dark" />
</LinearLayout>

<View
    android:id="@+id/centerLine"
    android:layout_width="match_parent"
    android:layout_height="4dp"
    android:layout_centerVertical="true"
    android:background="@android:color/holo_purple" />

<LinearLayout
    android:id="@+id/bottomSquares"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/centerLine"
    android:layout_centerVertical="true"
    android:orientation="horizontal" >

    <ImageView
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginRight="2dp"
        android:layout_weight="1"
        android:src="@android:color/holo_red_light" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginLeft="2dp"
        android:layout_weight="1"
        android:src="@android:color/holo_blue_light" />
</LinearLayout>

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="@drawable/circle" />

</RelativeLayout>

Aviv Ben Shabat
  • 1,073
  • 2
  • 13
  • 33
  • This is not the proper way to answer. Add some code, give more clarification. – Aniruddha Aug 28 '14 at 08:07
  • This is more or less it. Just use images instead of colors. – Aviv Ben Shabat Aug 28 '14 at 08:34
  • Yeah, It's working but I don't know how to register click listener only circular area.. Any idea ??? @Abs – Muhammad Zeshan Aug 29 '14 at 08:14
  • @MuhammadZeshan Yes. Read this - http://stackoverflow.com/q/1839273/2463875 both answers are good and correct. – Aviv Ben Shabat Aug 29 '14 at 08:21
  • @Abs No I want to be click only circle surface not on the transparent part.Did you understand? – Muhammad Zeshan Aug 29 '14 at 09:04
  • For example if you have a circle imageview and you want to click only circular area... circle image also have transparent rectangle area when we click on that part it also clicked. I mean to say that is there any way to click only circular part outside of circle is ignore – Muhammad Zeshan Aug 29 '14 at 09:14
  • Ok, now I understand. I don't think there is, but I'm not sure there isn't. What you could do, is use a xml shape drawable instead of a PNG image, and then you will not have these transparent angles. – Aviv Ben Shabat Aug 29 '14 at 09:19
  • @can you give me sample of drawable how you did that?? – Muhammad Zeshan Aug 29 '14 at 09:25
  • @Abs Can you comment on this? http://stackoverflow.com/questions/25564309/how-to-save-image-in-an-array-android-after-get-response-from-server?noredirect=1#comment39922332_25564309 – Muhammad Zeshan Aug 29 '14 at 16:02