Consider my semi-circle.xml
file:
<code><?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/semicircle"/>
<size
android:width="10dp"
android:height="5dp"/>
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"/>
</shape>
</code>
<code><?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/semicircle"/>
<size
android:width="10dp"
android:height="5dp"/>
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"/>
</shape>
</code>
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/semicircle"/>
<size
android:width="10dp"
android:height="5dp"/>
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"/>
</shape>
and moreover, for the buttons I have the_two_buttons.xml
:
<code><?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/semicircle"/> <!-- Button background color -->
<corners android:radius="25dp"/> <!-- Corner radius -->
<padding
android:left="8dp"
android:top="8dp"
android:right="8dp"
android:bottom="8dp"/>
</shape>
</code>
<code><?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/semicircle"/> <!-- Button background color -->
<corners android:radius="25dp"/> <!-- Corner radius -->
<padding
android:left="8dp"
android:top="8dp"
android:right="8dp"
android:bottom="8dp"/>
</shape>
</code>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/semicircle"/> <!-- Button background color -->
<corners android:radius="25dp"/> <!-- Corner radius -->
<padding
android:left="8dp"
android:top="8dp"
android:right="8dp"
android:bottom="8dp"/>
</shape>
This is the XML code that I have written:
<code><?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/semi_circle">
<ImageView
android:id="@+id/profile_avatar"
android:layout_width="10dp"
android:layout_height="5dp"
android:layout_marginTop="50dp"
android:src="@drawable/semi_circle" />
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="@string/intellij_clicker"
android:textSize="30.sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.07" />
</RelativeLayout>
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:background="@drawable/the_two_buttons"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:text="Button 1"
android:textColor="@android:color/white"
android:textColorHighlight="#B1D18A"
android:textColorHint="#B1D18A"
android:textColorLink="#B1D18A"
android:textCursorDrawable="#B1D18A"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<LinearLayout android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 2"
android:background="@drawable/the_two_buttons"
android:textColor="@android:color/white"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="@id/button1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</code>
<code><?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/semi_circle">
<ImageView
android:id="@+id/profile_avatar"
android:layout_width="10dp"
android:layout_height="5dp"
android:layout_marginTop="50dp"
android:src="@drawable/semi_circle" />
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="@string/intellij_clicker"
android:textSize="30.sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.07" />
</RelativeLayout>
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:background="@drawable/the_two_buttons"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:text="Button 1"
android:textColor="@android:color/white"
android:textColorHighlight="#B1D18A"
android:textColorHint="#B1D18A"
android:textColorLink="#B1D18A"
android:textCursorDrawable="#B1D18A"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<LinearLayout android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 2"
android:background="@drawable/the_two_buttons"
android:textColor="@android:color/white"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="@id/button1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</code>
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/semi_circle">
<ImageView
android:id="@+id/profile_avatar"
android:layout_width="10dp"
android:layout_height="5dp"
android:layout_marginTop="50dp"
android:src="@drawable/semi_circle" />
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="@string/intellij_clicker"
android:textSize="30.sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.07" />
</RelativeLayout>
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:background="@drawable/the_two_buttons"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:text="Button 1"
android:textColor="@android:color/white"
android:textColorHighlight="#B1D18A"
android:textColorHint="#B1D18A"
android:textColorLink="#B1D18A"
android:textCursorDrawable="#B1D18A"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<LinearLayout android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 2"
android:background="@drawable/the_two_buttons"
android:textColor="@android:color/white"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="@id/button1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
This is what I have expected:
But the scenario is different:
What’s wrong here? Since I am new in XML android layout, I am eager to learn. Thanks. I am confused regarding when to use RelativeLayout
and LinearLayout
. Any kind of suggestions would be highly appreciated.