0

enter image description here

Hi, I make application with this Image.

I want place the text on red dot points at lines left side and right side.

So I place the text on point, but when I change the device Galaxy S6 to S8, text placement depart from lines.

I seperate the lines and put weight on it, but still out.

How I can place the text on that image in variable device?

Please help me.

This is my layout.xml

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    >

                    <FrameLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent">

                        <ImageView
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:scaleType="centerInside"
                            android:src="@drawable/nursecategory"
                            />

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:orientation="vertical"
                        >

                        <!--first line-->
                        <LinearLayout
                            android:layout_width="fill_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal"
                            android:layout_marginTop="32dp"
                            >


                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:orientation="vertical"
                                android:gravity="center"

                                >

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Date"
                                    android:textColor="@color/colorCategory"
                                    android:textStyle="bold"
                                    android:layout_alignParentRight="true"
                                    />

                                <TextView
                                    android:id="@+id/nursetree_textview_Date"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_gravity="center"
                                    android:layout_marginTop="6dp"
                                    android:textAlignment="center"/>

                            </LinearLayout>



                            <TextView
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                />


                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:orientation="vertical"
                                android:gravity="center"
                                >

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Age"
                                    android:textColor="@color/colorCategory"
                                    android:textStyle="bold" />

                                <TextView
                                    android:id="@+id/nursetree_textview_Age"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_gravity="center"
                                    android:layout_marginTop="6dp"
                                    android:textAlignment="center"
                                    />

                            </LinearLayout>

                        </LinearLayout>

                        <!--second line-->
                        <LinearLayout
                            android:layout_width="fill_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal"
                            android:layout_marginTop="24dp"
                            >

                            <!--Name-->
                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:orientation="vertical"
                                android:gravity="center"
                                >

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Name"
                                    android:textColor="@color/colorCategory"
                                    android:textStyle="bold" />

                                <TextView
                                    android:id="@+id/nursetree_textview_Agency"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_gravity="center"
                                    android:layout_marginTop="6dp"
                                    android:textAlignment="center"
                                    />

                            </LinearLayout>



                            <TextView
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                />

                            <!--width-->
                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:orientation="vertical"
                                android:gravity="center"
                                >

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Width"
                                    android:textColor="@color/colorCategory"
                                    android:textStyle="bold" />

                                <TextView
                                    android:id="@+id/nursetree_textview_Width"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_gravity="center"
                                    android:layout_marginTop="6dp"
                                    android:textAlignment="center"
                                    />

                            </LinearLayout>

                        </LinearLayout>


                        <!--third line-->
                        <LinearLayout
                            android:layout_width="fill_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal"
                            android:layout_marginTop="26dp"
                            >

                            <!--place-->
                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:orientation="vertical"
                                android:gravity="center"
                                >

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Place"
                                    android:textColor="@color/colorCategory"
                                    android:textStyle="bold" />

                                <TextView
                                    android:id="@+id/nursetree_textview_Place"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_gravity="center"
                                    android:layout_marginTop="6dp"
                                    android:textAlignment="center"
                                    />

                            </LinearLayout>



                            <TextView
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                />

                            <!--heigth-->
                            <LinearLayout
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:orientation="vertical"
                                android:gravity="center"
                                >

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="Height"
                                    android:textColor="@color/colorCategory"
                                    android:textStyle="bold" />

                                <TextView
                                    android:id="@+id/nursetree_textview_Height"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_gravity="center"
                                    android:layout_marginTop="6dp"
                                    android:textAlignment="center"
                                    />

                            </LinearLayout>

                        </LinearLayout>





                    </LinearLayout>



                    </FrameLayout>

                </LinearLayout>


            </LinearLayout>
Polaris Nation
  • 1,085
  • 2
  • 18
  • 49
  • you need to adjust adapt your xml to auto adjust to any screen size and position, do not use fixed values as width and height , just position your textview by ids – Gastón Saillén Feb 19 '18 at 01:45
  • Possible duplicate of [Text size and different android screen sizes](https://stackoverflow.com/questions/9877946/text-size-and-different-android-screen-sizes) – Gastón Saillén Feb 19 '18 at 01:46
  • See https://developer.android.com/training/multiscreen/screensizes.html and in particular the 'smallest-width qualifier'. I also recommend creating an emulator for each supported screen size to test the things you'll learn from the web page. –  Feb 19 '18 at 01:55
  • @GastónSaillén Thanks but I didn't use fixed values all of them. just use match_parent,wrap_content, and give weight. – Polaris Nation Feb 19 '18 at 02:04
  • follow the posible duplicated thread i mention there , it should solve your problem, this is a common issue, theres have been answered tons of time in the community – Gastón Saillén Feb 19 '18 at 02:05
  • Please update your xml code. – Trần Đức Tâm Feb 19 '18 at 02:10
  • @GastónSaillén Oops sorry I missed some fixed values. – Polaris Nation Feb 19 '18 at 02:29
  • @TrầnĐứcTâm update xml code. help me please – Polaris Nation Feb 19 '18 at 02:30
  • Your problem's you have to support multi-size screen. With this support, depending on screen size, the image location should be changed. You now assuming that image location changed at `(x, y) (0, 0)` because of you using `LinearLayout` and `marginTop/Bottom`. – Trần Đức Tâm Feb 19 '18 at 03:03
  • Mine suggest is not a good solution, however, because of your requirements. Keep the image's scaleType == `centerInside`. Change your view into RelativeLayout. Create a new dummy view and set it centerInParrent. Set another view relative to this view. Imaging that your image will be scale smaller or bigger like that [←・→] – Trần Đức Tâm Feb 19 '18 at 03:07
  • The best solution that is creates a new custom view. However, it cost too much effort. – Trần Đức Tâm Feb 19 '18 at 03:08
  • How to do like OnClick on an Eye, hand(seperate image) of a doll. How to design this type of responsive xml?? (Note: Acyually it looks like single image but has many click event) – Arnold Brown Feb 19 '18 at 07:18

1 Answers1

0

use Relativelayout as parent layout then try to design your view. in Relaytivelayout we can add layouts as tray. and it easily to handle. also read about Relativlayout.

Anil Atri
  • 68
  • 8