Strange layout rendering created with xml in andoid

I want to arrange buttons evenly on the layout using styles to make my code simple. So why buttons have different distance between each other and ViewGroup? Am I right that attributes defined in the xml file overrides style’s attributes?

// xml code for the activity

<?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"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <Button
            style="@style/style1"
            android:id="@+id/b1"
            android:text="button1"
            app:layout_constraintBottom_toTopOf="@+id/b2" />

    <Button
            style="@style/style1"
            android:id="@+id/b2"
            android:text="button2"
            app:layout_constraintTop_toBottomOf="@+id/b1"
            app:layout_constraintBottom_toTopOf="@+id/b3" />

    <Button
            style="@style/style1"
            android:id="@+id/b3"
            android:text="button3"
            app:layout_constraintTop_toBottomOf="@+id/b2"/>

</androidx.constraintlayout.widget.ConstraintLayout>

// used style

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="style1">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:textSize">10dp</item>
        <item name="android:textColor">@color/teal_200</item>
        <item name="layout_constraintTop_toTopOf">parent</item>
        <item name="layout_constraintLeft_toLeftOf">parent</item>
        <item name="layout_constraintRight_toRightOf">parent</item>
        <item name="layout_constraintBottom_toBottomOf">parent</item>
    </style>
</resources>

Answer

What the three buttons have in common is layout_constraintEnd_toEndOf and layout_constraintStart_toStartOf.

So in style you will only define these two attributes of layout_constraint.

STYLE

<style name="style1" parent="Widget.AppCompat.Button.Colored">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:textSize">10sp</item>
    <item name="android:textColor">@color/teal_200</item>

    <!--  layout_constraint attributes  -->
    <item name="layout_constraintEnd_toEndOf">parent</item>
    <item name="layout_constraintStart_toStartOf">parent</item>
</style>

your_activity.xml

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".YourActivity">
    <Button
        android:id="@+id/b1"
        style="@style/style1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="button1"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@+id/b2"
        />
    <Button
        android:id="@+id/b2"
        style="@style/style1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="button2"
        app:layout_constraintTop_toBottomOf="@+id/b1"
        app:layout_constraintBottom_toTopOf="@+id/b3"
        />
    <Button
        android:id="@+id/b3"
        style="@style/style1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="button3"
        app:layout_constraintTop_toBottomOf="@+id/b2"
        app:layout_constraintBottom_toBottomOf="parent"
        />
</androidx.constraintlayout.widget.ConstraintLayout>

With this code, AndroidStudio will point out an error in the xml file, after all the ConstraintLayout was not made to define its attributes from style. But your app will run normally. Don’t forget to put your your ActivityClass in tools:context=".ActivityClass".

Tip: when you want to set a text size in any android xml, you should use “sp” instead of “dp“.

Example

Incorrect:

<item name="android:textSize">10dp</item>

Correct

<item name="android:textSize">10sp</item>

Advertisement

Answer