CODEWITHSUNDEEP
androidlayouttextviewgeometry
Konstantino Sparakis
Konstantino Sparakis

Reputation: 2981

a circle of textViews in android

I want to create a circle of Textviews like the image tagged below, in android. My eventual goal is to make a clock in which the numbers rotate with a finger swipe to the left or right.

I was able to produce the following with the code I received from Android align Image Buttons on a curve?

The main issue hear is that the code is based off an absolute layout. I want something that will work with all screen sizes, so something like this without the absolutelayout or any other recommendations on how to do this would be very helpful.

The coded edited a little.

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    AbsoluteLayout al = new AbsoluteLayout(this);
    setContentView(al);

    double radius = 300;
    double cx = 600, cy = 600;
    for(double angle = 0; angle < 360; angle += 30) {
        double radAngle = Math.toRadians(angle);
        double x = (Math.cos(radAngle)) * radius + cx;
        double y = (1 - Math.sin(radAngle)) * radius + cy;
        TextView textView = new TextView(this);
        textView.setText(Double.toString(angle));
        AbsoluteLayout.LayoutParams lp = new AbsoluteLayout.LayoutParams(600, 300, (int) x, (int) y);
        textView.setLayoutParams(lp);
        al.addView(textView);
    }}

This is what i currently have

Upvotes: 1

Views: 722

Answers (2)

Konstantino Sparakis
Konstantino Sparakis

Reputation: 2981

As a contribution to the community which I have used and loved for so long. The following code is originally from Android align Image Buttons on a curve? I have edited the following to my understanding to work on a RelativeLayout instead.

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        RelativeLayout al = new RelativeLayout(this);
        setContentView(al);

            // Change the radius to change size of cirlce
        double radius = 300;

            // Change these to control the x and y position of the center of the circle
            // For more screen friendly code changing this to margins might be more efficient
        double cx = 600, cy = 600;
        for(double angle = 0; angle < 360; angle += 30) {
            double radAngle = Math.toRadians(angle);
            double x = (Math.cos(radAngle)) * radius + cx;
            double y = (1 - Math.sin(radAngle)) * radius + cy;
            TextView textView = new TextView(this);
            textView.setText(Double.toString(angle));


                //the 150 is the width of the actual text view and the 50 is the height
            RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(150,50);

                 //the margins control where each of textview is placed
            lp.leftMargin = (int) x;
            lp.topMargin = (int) y;

            al.addView(textView, lp);
        }
    }

Upvotes: 1

Alex Salauyou
Alex Salauyou

Reputation: 14348

Instead of setting radius, cx, cy (suppose they are center coordinates?) hardcoded, get them by your absolutelayout's getWidth() and getHeight().

Upvotes: 1

Related Questions