How can you arrange elements like this enter image description here ?

2 answers 2

It is possible, and I use the principles of Material Design by taking the main element - the central icon with a cross.

RelativeLayout is well suited, position the minor elements relative to the main one, it remains only to set the necessary indents. You don't even have to use the additional ViewGroup.

  • I think you need more animations - iFr0z
  • I think there should be no problems with animation either - Kirill Stoianov
  • @KirillStoianov I’m not like a cap, but if the question is asked, then there are already problems - iFr0z
  • one
    @ShwarzAndrei, so I did, I just thought that there might be some other implementation option) - Nikotin N

Here is an example implementation suggested in the answer above:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="200dp" android:layout_height="200dp" android:background="@color/blue_grey_500"> <ImageView android:id="@+id/center" android:layout_width="40dp" android:layout_height="40dp" android:background="@color/colorAccent" android:layout_centerInParent="true"/> <ImageView android:id="@+id/top" android:layout_width="40dp" android:layout_height="40dp" android:background="@color/colorAccent" android:layout_alignParentTop="true" android:layout_centerHorizontal="true"/> <ImageView android:id="@+id/left_top" android:layout_width="40dp" android:layout_height="40dp" android:background="@color/colorAccent" android:layout_centerVertical="true" android:layout_below="@+id/top" /> <ImageView android:id="@+id/right_top" android:layout_width="40dp" android:layout_height="40dp" android:background="@color/colorAccent" android:layout_centerVertical="true" android:layout_alignParentRight="true" android:layout_alignParentEnd="true" android:layout_below="@+id/top" /> <ImageView android:id="@+id/left_bottom" android:layout_width="40dp" android:layout_height="40dp" android:background="@color/colorAccent" android:layout_centerVertical="true" android:layout_below="@+id/center" android:layout_marginStart="15dp" android:layout_marginLeft="15dp" /> <ImageView android:id="@+id/right_bottom" android:layout_width="40dp" android:layout_height="40dp" android:background="@color/colorAccent" android:layout_centerVertical="true" android:layout_alignParentRight="true" android:layout_alignParentEnd="true" android:layout_below="@+id/center" android:layout_marginRight="15dp" android:layout_marginEnd="15dp" /> </RelativeLayout>

enter image description here