Photoshop Question posted in
The official user guide can be found here.

How would I keep UI elements aligned with the background? – Photoshop

so for a school project, I’m making an app but I’m just stuck on the last point.
I predesigned a background for my app in photoshop and imported it into Android Studio.
In this background, I already put the buttons and my plan was to, in the android studio, just put the buttons on it and it’ll work.
The problem is that the buttons don’t align with the background when I launch the app.
I got two screenshots to show what I mean:

  1. This is how it looks in Android Studio itself:
    https://gyazo.com/05c818710de2db29b630beb8107577e2

  2. This is what happens when I launch the app:
    https://gyazo.com/2369f3b2c0154262620482b53e007729

Did anyone get any idea how to fix this?
Thanks in advance!

Tags:

2

Answers


  1. 0

    Your background screen will be display different as per the screen resolution of the different different android devices.

    So as per my experience you should remove that buttons from the background and you have to set button’s background in your layout file as per your requirement.

    Login or Signup to reply.
  2. 0

    You should group your buttons in LinearLayout with android:layout_gravity=”center” to keep it in center of layout, like so:

    <?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/home"
    tools:context="com.example.larsb.csvvg.Home">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:orientation="vertical">

        <Button
            android:id="@+id/Lariks"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:text="Button"
            android:visibility="visible" />

        <Button
            android:id="@+id/Salland"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="45dp"
            android:text="Button"
            android:visibility="visible" />

        <Button
            android:id="@+id/CSG"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="45dp"
            android:text="Button"
            android:visibility="visible" />

    </LinearLayout>

</FrameLayout>

    Also, adjust android:layout_marginTop to roughly match the background file

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search