Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Drawing a square layout inside a circle

I am trying to make a relative layout bounded within a circle i.e the relative layout should be like the square shown in the figure below.

I am trying to set width and height of the layout as:

√((diameter)²/2) which is about 70 %

square inside a circle
(source: yogaflavoredlife.com)

public class SquareLayout extends RelativeLayout {
    public SquareLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int originalWidth = MeasureSpec.getSize(widthMeasureSpec);
        int originalHeight = MeasureSpec.getSize(heightMeasureSpec);
        int required = Math.min(originalWidth, originalHeight) * 7 / 10;

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        setMeasuredDimension(required, required);
    }
}

What I am getting is a rectangular layout instead of square layout:

Can anyone guide me where I am going wrong?

Sample usage:

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

    <com.example.widget.SquareLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#F55C5C">

    </com.example.widget.SquareLayout>

</RelativeLayout>
like image 221
Samir Avatar asked May 07 '15 11:05

Samir


People also ask

Can you draw a circle and a square at the same time?

Doing different things with the two hands at the same time, like rubbing your stomach while padding your head, is difficult. Drawing a circle with the left hand while drawing a square with the right hand is nearly impossible.

Can we draw rectangle in circle?

So, all you have to do is dissect the circle vertically and horizontally. Then, each point that the intersecting lines touch the circle gets connected to the next line. Basically, just draw a cross through the center of the circle, then connect the points. That will give you the square.


1 Answers

Here's how I got the solution. First I created a square frame to hold all the layouts.

public class SquareFrame extends FrameLayout {
    public SquareFrame(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int originalWidth = MeasureSpec.getSize(widthMeasureSpec);
        int originalHeight = MeasureSpec.getSize(heightMeasureSpec);
        int required = Math.min(originalWidth, originalHeight);

        super.onMeasure(
            MeasureSpec.makeMeasureSpec(required, MeasureSpec.EXACTLY),
            MeasureSpec.makeMeasureSpec(required, MeasureSpec.EXACTLY));
    }
}

Then inserted all layouts within that square frame.

<com.example.widget.SquareFrame 
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#5CF5FC">

    <com.example.widget.SquareLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#F55C5C">

    </com.example.widget.SquareLayout>

</com.example.widget.SquareFrame>

Here is what I got a square, not a rectangle.

like image 112
Samir Avatar answered Oct 31 '22 04:10

Samir