Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Scale drawable circle according to screen size

Its been a while I am stuck with this. I am a newbie android developer.

I have a drawable circle.

circular_shape.xml

<?xml version="1.0" encoding="utf-8"?>    
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:useLevel="false"
    android:shape="ring"
    android:thickness="0.8dp">
    <solid android:color="@android:color/holo_blue_dark"/>
</shape>

now i want to use this circle in my activity layout in such a way that it covers the whole screen. That is, the width of the screen should be equal to Diameter of the circle. Note that I have not set the radius of the circle.

example_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/exampleLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.anil.raceorganizer.ExampleActivity">
    <ImageView
        android:id="@+id/race_field"
        android:src="@drawable/circular_shape"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/darker_gray"
        android:padding="0dp"
        android:layout_margin="0dp"
        ></ImageView>
</FrameLayout>

Note that I have tried to put padding and margin as 0, but it didn't work. I also tried setting the size of the ImageView through code, but it only changed the size of the ImageView as a whole and not circle alone.

This is what I get with this code.

enter image description here

Any help is greatly appreciated.

like image 282
Anil P Babu Avatar asked Oct 19 '22 03:10

Anil P Babu


2 Answers

You can try this code:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:thickness="0.8dp"
    android:useLevel="false"
    android:innerRadiusRatio="2.1">
    <solid android:color="@android:color/holo_blue_dark" />
</shape>
like image 95
Bui Minh Duc Avatar answered Oct 21 '22 06:10

Bui Minh Duc


Using Canvas, we can draw shapes matching the screen width.

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    Display display = getWindowManager().getDefaultDisplay(); 
    int width = display.getWidth();
    int height = display.getHeight();

    Bitmap bmp = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_4444);

    Canvas c = new Canvas(bmp);

    RectF rect = new RectF(0,0,width,width);
    drawCircle(rect, c, width, height);

}

private void drawCircle(RectF rect, Canvas c, int width, int height) {
        Paint paint = new Paint();
        paint.setARGB(255, 255 , 10, 21);
        paint.setStrokeWidth(8);
        paint.setAntiAlias(true);
        paint.setStrokeCap(Paint.Cap.BUTT);
        paint.setStyle(Paint.Style.STROKE);
        int radius;
        if(width < height)
            radius = width/2;
        else 
            radius = height/2;

        radius-= 4;
        c.drawCircle(width/2, height/2, radius, paint);
    }

Not sure if it might help you. If its not , let me know. I will prefer deleting than getting downvotes!

like image 28
Sreehari Avatar answered Oct 21 '22 04:10

Sreehari