CODEWITHSUNDEEP
javaandroid-studio
CarlJade
CarlJade

Reputation: 91

Proper margin layout in Android Studio

I'm confused if my code is right or not, for now when I run my app under android version 10 it works well, this is the result I want and it works fine when I run Result

but the problem is I don't think if I run this app to the other version of android it will work or I think the design of textviews and ImageView will be scattered since when I've tried to view the design of the XML it looks like this ViewInAndroidStudio

I've put it inside Gridview. It's very helpful for me as a newbie in android if someone can help me.

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal" android:layout_width="match_parent"
android:background="@color/background"
android:layout_height="match_parent">

<ImageView
    android:layout_width="110dp"
    android:layout_height="100dp"
    app:srcCompat="@mipmap/ic_launcher"
    android:id="@+id/imgFood"
    android:layout_marginTop="10dp"
    android:layout_marginBottom="10dp"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:background="@drawable/round_outline"
    />

<ImageView
    android:layout_width="110dp"
    android:layout_height="100dp"
    app:srcCompat="@mipmap/ic_launcher"
    android:id="@+id/imgId"
    android:layout_marginTop="10dp"
    android:layout_marginBottom="10dp"
    android:layout_alignLeft="@id/imgFood"
    android:layout_marginLeft="100dp"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true"
    android:background="@drawable/round_outline"
    />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/txtCcText"
    android:text="Cash Card number:"
    android:textSize="13sp"
    android:hint="Cash Card no."
    android:textColor="@color/primary"
    android:layout_toRightOf="@+id/imgId"
    android:layout_alignParentRight="true"
    android:layout_marginRight="17dp"
    android:layout_marginLeft="-11dp"
    android:layout_marginTop="10dp"
    android:textStyle="bold|italic"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/txtName"
    android:text="Cash Card number"
    android:textSize="10sp"
    android:textColor="@color/black"
    android:layout_toRightOf="@+id/imgId"
    android:textAlignment="center"
    android:layout_alignParentRight="true"
    android:layout_marginRight="17dp"
    android:layout_marginLeft="5dp"
    android:layout_marginTop="30dp"
    android:textStyle="bold"
    />

<TextView
    android:id="@+id/txtHHno"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/txtName"
    android:layout_marginLeft="-11dp"
    android:layout_alignParentRight="true"
    android:layout_marginEnd="50dp"
    android:text="Household number:"
    android:textColor="@color/primary"
    android:textSize="13sp"
    android:textStyle="bold|italic"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/txtPrice"
    android:text="HHNumber"
    android:textSize="10sp"
    android:layout_below="@+id/txtHHno"
    android:textColor="@color/black"
    android:layout_toRightOf="@+id/imgId"
    android:textAlignment="center"
    android:layout_alignParentRight="true"
    android:layout_marginRight="17dp"
    android:layout_marginLeft="5dp"
    android:textStyle="bold"
    />
<TextView
    android:id="@+id/txtSeries"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/txtPrice"
    android:layout_marginLeft="-11dp"
    android:layout_alignParentRight="true"
    android:layout_marginEnd="75dp"
    android:text="Series number:"
    android:textColor="@color/primary"
    android:textSize="13sp"
    android:textStyle="bold|italic"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/txtSeriesNumber"
    android:text="SeriesNumber"
    android:textSize="10sp"
    android:layout_below="@+id/txtSeries"
    android:textColor="@color/black"
    android:layout_toRightOf="@+id/imgId"
    android:textAlignment="center"
    android:layout_alignParentRight="true"
    android:layout_marginRight="17dp"
    android:layout_marginLeft="5dp"
    android:textStyle="bold"/>
</RelativeLayout>

GridView.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
>

<com.google.android.material.appbar.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
    <androidx.appcompat.widget.Toolbar
        android:id="@+id/mainToolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/primary"
        android:backgroundTint="@color/background"
        app:liftOnScroll="true"/>
</com.google.android.material.appbar.AppBarLayout>

<GridView
    android:layout_marginTop="50dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/gridView"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:columnWidth="300dp"
    android:gravity="center"
    android:numColumns="auto_fit" />
</RelativeLayout>

Upvotes: 0

Views: 328

Answers (1)

Rupesh Rathore
Rupesh Rathore

Reputation: 339

<LinearLayout 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="wrap_content"
android:orientation="horizontal">

<ImageView
    android:id="@+id/imgFood"
    android:layout_width="110dp"
    android:layout_height="100dp"
    android:layout_margin="8dp"
    android:scaleType="centerCrop"
    app:srcCompat="@mipmap/ic_launcher" />

<ImageView
    android:id="@+id/imgId"
    android:layout_width="110dp"
    android:layout_height="100dp"
    android:layout_margin="8dp"
    android:scaleType="centerCrop"
    app:srcCompat="@mipmap/ic_launcher" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="8dp"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/txtCcText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Cash Card no."
        android:text="Cash Card number:"
        android:textColor="@color/colorPrimary"
        android:textSize="13sp"
        android:textStyle="bold|italic" />

    <TextView
        android:id="@+id/txtName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="1234-5678-9000-0000"
        android:textAlignment="center"
        android:textColor="@color/black"
        android:textSize="10sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/txtHHno"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Household number:"
        android:textColor="@color/colorPrimary"
        android:textSize="13sp"
        android:textStyle="bold|italic" />

    <TextView
        android:id="@+id/txtPrice"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="123-4567"
        android:textAlignment="center"
        android:textColor="@color/black"
        android:textSize="10sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/txtSeries"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Series number:"
        android:textColor="@color/colorPrimary"
        android:textSize="13sp"
        android:textStyle="bold|italic" />

    <TextView
        android:id="@+id/txtSeriesNumber"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="1234567890"
        android:textAlignment="center"
        android:textColor="@color/black"
        android:textSize="10sp"
        android:textStyle="bold" />
</LinearLayout>

Upvotes: 1

Related Questions