CODEWITHSUNDEEP
androidxml
Saurabh Saluja
Saurabh Saluja

Reputation: 290

Relative layout in the form of a Circle

I want to make a relative layout in the form of a circle.I don't want to use canvas because I cannot handle clickable events in canvas.I want every event like mouse click etc to be executed within that circle only.On clicking outside the circle none of the layout event should be executed.
enter image description here

I have following code , circle.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

   <solid 
       android:color="@android:color/white"/>

   <size 
       android:width="10dp"
       android:height="10dp"/>
</shape>

,img.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

   <item android:drawable="@drawable/circle"/>

</layer-list>

,layout

<RelativeLayout
        android:id="@+id/test_layout"
        android:layout_width="700px"
        android:layout_height="700px"
        android:background="@drawable/img" />

But this code is setting circle on background of relative layout, which is in the form of rectangle .Whatever the event I add to relative layout get executed outside the circle.I wish if the entire layout is a circle.How can I do that?.

Upvotes: 4

Views: 7834

Answers (2)

Budius
Budius

Reputation: 39836

Every layout is a rectangle. you cannot change that. That's how the Android UI framework works.

But you can draw a circle (the way you're already doing) and handle the touch events yourself.

For that you have to create a custom relative layout (or any other type of layout you need):

public class CircleRelativeLayout extends RelativeLayout {

and @Override the touch methods:

public boolean onInterceptTouchEvent (MotionEvent event) {
    if(isInsideCircle(event)){
       return super.onInterceptTouchEvent(event);
    } else {
       return false;
    }
}

public boolean onTouchEvent (MotionEvent event) {
    if(isInsideCircle(event)){
        return super.onTouchEvent(event);
    } else {
        return false;
    }
}

then it's just a matter of creating the method private boolean isInsiderCircle(MotionEvent event) using geometry stuff.

Upvotes: 3

Anshul Tyagi
Anshul Tyagi

Reputation: 446

Create a xml file and add in drawable folder

 <?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="oval" >   
 <solid android:color="#65BF59"/> <!-- this one is ths color of the  Rounded Button -->
  <corners
  android:bottomRightRadius="100dp"
  android:bottomLeftRadius="100dp"
  android:topLeftRadius="100dp"
  android:topRightRadius="100dp"/>
 </shape>

Use this file in the background of your layout.

Upvotes: 1

Related Questions