I am new at Xamarin and started working with it yesturday. I am trying to make an Android App using it in Visual Studio 2017, it works fine on Android Version 8.0, but on v. 7.0 the control elements on the screen get into different places.
Android 8.0:
Android 7.0:
Designer code:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="25px"
android:minHeight="25px">
<TextView
android:text="Available Queries:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/queriescnt"
android:textAlignment="center" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/queriescnt"
android:id="#+id/email"
android:layout_marginHorizontal="10dp"
android:layout_marginTop="35dp"
android:layout_marginRight="326.0dp"
android:singleLine="true" />
<Button
android:text="Search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/email"
android:id="#+id/submit"
android:layout_marginVertical="20dp"
android:layout_marginHorizontal="10dp" />
<EditText
android:layout_width="249.0dp"
android:layout_height="wrap_content"
android:layout_below="#id/submit"
android:id="#+id/keybox"
android:layout_marginVertical="300dp"
android:layout_marginHorizontal="50dp"
android:layout_marginRight="201.5dp"
android:password="true"
android:inputType="none|textPassword" />
<TextView
android:text="KEY:"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/submit"
android:id="#+id/textView1"
android:layout_marginVertical="320dp"
android:layout_marginHorizontal="10dp" />
<CheckBox
android:text="S"
android:layout_width="54.5dp"
android:layout_height="wrap_content"
android:layout_below="#id/submit"
android:id="#+id/store"
android:layout_marginVertical="315dp"
android:layout_marginHorizontal="300dp" />
<TextView
android:text="Current line count:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/submit"
android:id="#+id/dbcount"
android:gravity="center_horizontal|center_vertical"
android:textSize="40dp"
android:inputType="none|textMultiLine" />
</RelativeLayout>
Can you please help me to make all the elements appear the same on different versions? I would be really thankful, if you also suggest me, what i can do better.
Your margins are messing up your layout. You cannot just add more margin to a view to position it relatively to another view.
I have adjusted your layout to match what you have in the first screen shot.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/queriescnt"
android:text="Available Queries:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center" />
<EditText
android:id="#+id/email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/queriescnt"
android:layout_marginHorizontal="10dp"
android:layout_marginTop="35dp"
android:maxLines="1" />
<Button
android:id="#+id/submit"
android:text="Search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/email"
android:layout_marginVertical="20dp"
android:layout_marginHorizontal="10dp" />
<TextView
android:id="#+id/dbcount"
android:text="Current line count:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/submit"
android:gravity="center_horizontal|center_vertical"
android:textSize="40dp"
android:inputType="none|textMultiLine" />
<TextView
android:id="#+id/textView1"
android:text="KEY:"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"/>
<CheckBox
android:id="#+id/store"
android:text="S"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_margin="10dp"
android:layout_alignParentBottom="true" />
<EditText
android:id="#+id/keybox"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:password="true"
android:inputType="none|textPassword"
android:layout_alignBaseline="#+id/textView1"
android:layout_toEndOf="#+id/textView1"
android:layout_toStartOf="#+id/store"
tools:text="abc" />
</RelativeLayout>
What you may notice here is that I use toEndOf, toStartOf, alignBaseline, alignParentStart, alignParentEnd and alignParentBottom instead of the margins you had.
Simply adding 300dp margin to a view may work in the view port of the preview of the designer while you are fiddling with it. However not all screens have equal width and height both in physical size and in pixel density. Hence, 300dp will not look the same on all screens.
You can try the following code. I have tested the code on Android 7.0 and Android 8.0, it works properly.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="25px"
android:minHeight="25px">
<TextView
android:text="Available Queries:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/queriescnt"
android:textAlignment="center" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/queriescnt"
android:id="#+id/email"
android:layout_marginHorizontal="10dp"
android:layout_marginTop="35dp"
android:layout_marginRight="326.0dp"
android:singleLine="true" />
<Button
android:text="Search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/email"
android:id="#+id/submit"
android:layout_marginVertical="20dp"
android:layout_marginHorizontal="10dp" />
<TextView
android:text="Current line count:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/submit"
android:id="#+id/dbcount"
android:gravity="center_horizontal|center_vertical"
android:textSize="40dp"
android:inputType="none|textMultiLine" />
<LinearLayout
android:layout_marginTop="200dp"
android:gravity="center"
android:layout_marginBottom="12dp"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/dbcount"
android:orientation="horizontal">
<TextView
android:text="KEY:"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView1"
android:layout_marginHorizontal="10dp" />
<EditText
android:hint="input"
android:layout_width="249.0dp"
android:layout_height="wrap_content"
android:id="#+id/keybox"
android:layout_toRightOf="#id/textView1"
android:password="true"
android:inputType="none|textPassword" />
<CheckBox
android:text="S"
android:layout_width="54.5dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/keybox"
android:id="#+id/store"/>
</LinearLayout>
</RelativeLayout>
Android 7.0
enter image description here
Android 8.0
enter image description here
Note:
You could include the three controls(TextView, EditText, CheckBox) into a parent layout(eg. LinearLayout), then you do not need to set the properties for each three controls.
The layout_below perperty you set is not right. When you add the parent layout for the below controls, you just need to add the property for the parent layout.
android:layout_below="#id/dbcount"
Related
When I create a new Layout, it is appearing on the right side of the screen. I want it to be at the bottom, below my linear layout. Example in the picture.
LayoutPicture
Do you want to achieve result like following GIF?
if so, you can add the android:gravity="bottom" in the outside LinearLayout, here is my layout xml(If you want layout to the bottom-center, you can use android:gravity="bottom|center").
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
>
<LinearLayout
android:layout_width="200dp"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="First Name"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="Last Name"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="UserName"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="Password"
/>
<LinearLayout
android:layout_width="200dp"
android:layout_height="wrap_content"
android:orientation="horizontal">
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"
android:textColor="#android:color/black"
/>
</LinearLayout>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="Email"
/>
</LinearLayout>
update
Do you want to achieve the result like following layout??
If so, Here is code.
android:layout_width="match_parent"
android:layout_height="match_parent"
>
>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="First Name"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="Last Name"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="UserName"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="Password"
/>
<LinearLayout
android:layout_width="200dp"
android:layout_height="wrap_content"
android:orientation="horizontal">
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"
android:textColor="#android:color/black"
/>
</LinearLayout>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="Email"
/>
</LinearLayout>
Make sure to set the orientation of the parent layout to vertical. It is horizontal by default.
<LinearLayout
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"
android:orientation="vertical">
<!-- your inner layouts here -->
</LinearLayout>
I implemented a barcode scanner in our Xamarin app. To implement the scanner I followed this tutorial: https://www.c-sharpcorner.com/article/xamarin-android-qr-code-reader-by-mobile-camera/
So, I have a SurfaceView, a CameraSource and a BarcodeDetector. Now I want to crop the camera preview to say the scanner where the barcode in which we have to scan because it is possible that the source from which we can have more than one barcode.
I think this will work with Simple Crop View (or something similar) but I don't how to implement it.
All solutions found here are not working or I'm missing something.
Do you want to acheve it like this GIF?
If so, you could achieve it with ZXing.Net.Mobile
https://github.com/Redth/ZXing.Net.Mobile
There is my demo
https://github.com/851265601/Scanebarcode
Update: If you still want to use the solution like the blew link
https://www.c-sharpcorner.com/article/xamarin-android-qr-code-reader-by-mobile-camera/
I changed the layout like following code. I usd FramLayout, SurfaceView was coverd by other raylout just like LinearLayout or relativelayout
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<SurfaceView
android:id="#+id/cameraView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<RelativeLayout
android:background="#953399ff"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="330dp"
android:orientation="horizontal">
<RelativeLayout
android:background="#953399ff"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
<RelativeLayout
android:id="#+id/rlscan"
android:layout_width="220dp"
android:layout_height="fill_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/area_above_left" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/area_above_right" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:src="#drawable/area_below_left" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:src="#drawable/area_below_right" />
</RelativeLayout>
<RelativeLayout
android:background="#953399ff"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
</LinearLayout>
<RelativeLayout
android:background="#953399ff"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1">
<TextView
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:id="#+id/txtResult"
android:layout_below="#+id/cameraView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Please focus Camera to QR Code"
android:textSize="10sp"
android:layout_marginTop="20dp" />
</RelativeLayout>
</LinearLayout>
</FrameLayout>
Xamarin Android
I'm trying make slidedown menu.
I don't know, what i'm doing wrong.
I can't position textView like i want.
View should be on the top of screen. However, it's on the bottom.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="25px"
android:minHeight="25px"
android:background="#f2f2f2">
<RelativeLayout
android:id="#+id/productTitleBar"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:background="#ff46a1e1">
<TextView
android:id="#+id/txtProductTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:text="Product List"
android:layout_gravity="center"
android:clickable="true"
android:layout_centerVertical="true"
android:textSize="18dp"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<TextView
android:id="#+id/txtDescription"
android:layout_width="match_parent"
android:layout_height="100dp"
android:textColor="#000000"
android:text="Desription goes here"
android:layout_gravity="center"
android:clickable="true"
android:textSize="18dp"
android:layout_above="#+id/btnImgExpander"
android:background="#FFFFFF"
android:gravity="center"
android:visibility="gone" />
<ImageView
android:id="#+id/btnImgExpander"
android:layout_alignParentBottom="true"
android:layout_height="30dp"
android:layout_width="match_parent"
android:src="#drawable/up_arrow"
android:background="#fff2f2f2" />
<ListView
android:id="#+id/productListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="55dp"
android:layout_marginBottom="30dp"
android:background="#android:color/background_light"
android:fastScrollEnabled="true" />
</RelativeLayout>
I have
I want
Someone can help me with this problem?
android:layout_above="#+id/btnImgExpander" is set on the TextView, but android:layout_alignParentBottom="true" is set on the ImageView, which is aligning it to the bottom of the container (the outer RelativeLayout). You could try: android:layout_alignParentTop="true" and remove the android:layout_alignParentBottom="true"
I'm trying to recreate a cardview similar to this one with an image with title on top and then some data and maybe some action buttons below. But for the life of me I can't get the text to be on top of the image.
Here is what I have so far
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:cardview="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="325dp"
android:layout_margin="8dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/image1"
android:layout_width="match_parent"
android:layout_height="230dp"
android:layout_alignParentTop="true"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/recipeName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image1"
android:maxLines="3"
android:padding="8dp"
android:text="name"
android:textColor="#222"
android:textStyle="bold"
android:textSize="22dp" />
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/recipeName"
android:maxLines="3"
android:padding="8dp"
android:text="description"
android:textColor="#666"
android:textSize="14dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/description">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/recipeName"
android:maxLines="3"
android:padding="8dp"
android:text="View"
android:textColor="#666"
android:textSize="14dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/recipeName"
android:maxLines="3"
android:padding="8dp"
android:text="Add"
android:textColor="#666"
android:textSize="14dp" />
</LinearLayout>
</RelativeLayout>
I will assume you want #+id/recipeName on top of #+id/image1.
On recipeName, you have set: android:layout_below="#+id/image1" which will layout the element below image1. Remove that line as you do not want it below that element. Try android:layout_alignBottom="#+id/image1". There are enough layout parameters to do most things: LayoutParams, though it can be a bit of a rabbit hole once you start doing complex layouts...
Also you've got layout_below on elements inside your LinearLayout which won't do anything.
Currently i'm developing a mobile application that shows some values (they will never change, so they are saved in a List). When i'm designing the page in the designer with device 4.7 WXGA i have much space to the bottom but on my real phone (Motorola Moto G3) there is no space.
Now i worry about what happens if i deploy the app on different phones (Samsung, etc). I always thought the advantage of creating a UI with something like AXML makes the app "responsive" in a meaning that it fits to the device which it is running on. But why is this not happening?
May someone give me a hint how to archieve this?
Edit:
Here is my AXML Code - for here i replaced the real text with Text
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff">
<LinearLayout
android:orientation="vertical"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout1"
android:layout_marginTop="5dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout2"
android:layout_margin="5dp"
android:gravity="center">
<LinearLayout
android:orientation="horizontal"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/linearLayout6">
<ImageView
android:layout_width="32dp"
android:layout_height="40dp"
android:id="#+id/imgLeft"
android:src="#drawable/arrow_left"
android:layout_marginRight="50dp" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/linearLayout5"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/tbDin"
android:textSize="35dp"
android:layout_marginRight="15dp"
android:textColor="#android:color/black" />
<TextView
android:layout_width="60dp"
android:layout_height="match_parent"
android:id="#+id/tbDinWert"
android:textSize="35dp"
android:textColor="#android:color/black"
android:gravity="center"
android:text="XX" />
<ImageView
android:layout_width="32dp"
android:layout_height="40dp"
android:id="#+id/imgRight"
android:src="#drawable/arrow_right"
android:layout_marginLeft="50dp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout3"
android:background="#android:color/transparent"
android:layout_marginTop="5dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb1"
android:textSize="16dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:inputType="none"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb2"
android:textSize="16dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:inputType="none"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb3"
android:textSize="16dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:inputType="none"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb3"
android:textSize="16dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:inputType="none"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb4"
android:textSize="16dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:inputType="none"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb5"
android:textSize="16dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb6"
android:textSize="10dp"
android:layout_marginRight="142dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:background="#android:color/transparent"
android:paddingLeft="15dp">
<TextView
android:layout_width="90dp"
android:layout_height="match_parent"
android:id="#+id/tb7"
android:textSize="10dp"
android:textColor="#android:color/black"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="142dp"
android:gravity="center" />
<TextView
android:text="Text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/TextView4"
android:textSize="35dp"
android:background="#android:color/transparent"
android:textColor="#android:color/black"
android:gravity="center" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Ok, so first you cannot use same ids for views like linearLayout4. Second, correct practise is best practise so insted of creating so many layouts, create header and ListView and then populate it. Weather you have 3 item or 333 use ListView.
Next thing dont use android:layout_marginRight="142dp" like this. Margin and padding should be much smaller and for acheaving efect of streaching items use something like this:
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout4"
android:layout_margin="5dp"
android:gravity="center">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="16dp"
android:textColor="#android:color/black"
android:text="Value"
android:layout_weight="0.5"
android:gravity="center"/>
<TextView
android:text="Text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="35dp"
android:textColor="#android:color/black"
android:layout_weight="0.5"
android:gravity="center"/>
</LinearLayout>
You can paste it to see the result.
Try to practise design in program that u are creating your app. If you are using AndroidStudio it has preview so you can check diferent size of screens.
And for any layout or view if you set android:layout_width="match_parent" android:layout_height="match_parent" it will always fit to the device.
Try creating layouts and view, with different background, while changing height and width so you can see what is happening.
You have to keep in mind that devices have different screen sizes and different densities. Don't set your pixel sizes in px, but in sp for fonts(scaleable pixels). For other things, use dp instead of px
You have to handle multiple screen sizes by creating layout-ldpi, mdpi, hdpi, xhdpi. So that any screen sizes is there, look and feel will be the same across all the devices,and also font should be in "sp" and other elements in "dp".
I think that you need a full-size None-Stretched Image in your aplication with this tutorial you can adapt a image in every device without problem
https://dzone.com/articles/using-full-size-none-stretched
or this other thing if you wanna adapt your app for the type of device or OS.
The static Device class includes several properties and methods that allow your code to deal with device differences at run time in a very simple and straightforward manner:
The Device.OS property returns a member of the TargetPlatform
enumeration: iOS, Android, WinPhone, or Other. The WinPhone member
refers to all the Windows and Windows Phone platforms.
The Device.Idiom property returns a member of the TargetIdiom
enumeration: Phone, Tablet, Desktop, or Unsupported.
You can use these two properties in if and else statements, or a switch and case block, to execute code specific to a particular platform.
https://developer.xamarin.com/guides/xamarin-forms/platform-features/device/
https://forums.xamarin.com/discussion/56817/how-to-use-platform-idiom-in-xaml
and in this book you can watch a excellent example the use of Device.OnPlatform page 58.
https://developer.xamarin.com/guides/xamarin-forms/creating-mobile-apps-xamarin-forms/
I hope with this you solve your problem. Regards.