Setting alpha of background also effects text within children - android

I am developing an Android app, but when I change the alpha value of the background, its children are also effected and every text within the element is faded out.
How can I remove the fade from the text in the layout?
Here is my XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:background="#color/whitesmoke"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="90dp">
<ImageView
android:alpha="0.5"
android:scaleType="centerCrop"
android:id="#+id/iv_user_background"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:padding="10dp"
android:gravity="center_vertical"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
app:civ_border_width="5dp"
app:civ_border_color="#color/white"
android:id="#+id/civ_user_profile"
android:layout_width="70dp"
android:layout_height="70dp" />
<LinearLayout
android:alpha="0.5"
android:background="#color/colorAccent"
android:paddingLeft="10dp"
android:layout_weight="1"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:textSize="18dp"
android:layout_marginTop="5dp"
android:id="#+id/tv_user_name"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<LinearLayout
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="3dp"
android:paddingBottom="3dp"
android:alpha="30"
android:layout_marginTop="5dp"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/iv_user_like"
android:layout_width="15dp"
android:layout_height="15dp" />
<TextView
android:textSize="10dp"
android:layout_marginLeft="5dp"
android:id="#+id/tv_user_like_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabLayout
android:id="#+id/tl_user_nav_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize" />
</LinearLayout>
<FrameLayout
android:background="#color/whitesmoke"
android:id="#+id/user_main_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
And here is a screenshot of the result:


If your background is just a color you can remove the alpha from your layout.
Instead of using #color/colorAccent you can use a hex color like #BBFF80AB
Hex colors are have a structure like: #AARRGGBB where AA-alpha, RR-red, GG-green, BB-blue. By changing the alpha of that color, you change the alpha of only the background, and not all of the views'. So, in your case, make the layout be like this:
<LinearLayout
android:background="#80FF80AB"
android:paddingLeft="10dp"
android:layout_weight="1"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

Related

white backgroud for png Image in android studio

I'm trying to show some png images on RecyclerView, the images has transparent background but it show white background when run on device !!.
I tried to add
android:background="#android:color/transparent"
to ImageView, but still white
I use Picasso to load the image on ImageView, like that
Picasso.get()
.load(newpath)
.into(itemView.imgMCat)
this the fragment which contain the RecyclerView
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:background="#drawable/meskback"
tools:context=".HomeFragment">
<!-- TODO: Update blank fragment layout -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="10">
<Toolbar
android:id="#+id/toolbar"
android:background="#color/meskBlue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light"
tools:targetApi="lollipop">
<Button
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="right"
android:layout_margin="7dp"
android:id="#+id/mapiconbtn"
android:background="#drawable/mapicon"
/>
</Toolbar>
<LinearLayout
android:layout_weight="6"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="10"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:id="#+id/mainActivityRelayout1"
android:paddingTop="10dp"
android:layout_weight="5">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
tools:srcCompat="#drawable/logo"
android:id="#+id/logoimg"
android:contentDescription="#string/logoimgdes"
android:src="#drawable/logo"
android:layout_centerHorizontal="true"
android:layout_marginTop="12dp"
/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="5"
android:weightSum="2">
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:textSize="22sp"
android:layout_weight="1"
android:textStyle="bold"
android:gravity="center"
android:textColor="#color/meskBlue"
android:text="#string/welcome"
android:textAlignment="center"/>
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:textSize="20sp"
android:textStyle="bold"
android:gravity="center"
android:layout_marginTop="20dp"
android:text="#string/how_can_we_help_you"
android:textAlignment="center"/>
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_weight="4"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/McatRecylceView"/>
</LinearLayout>
</LinearLayout>
</FrameLayout>
and this is the item_view.xml which contain the ImageView
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="10dp">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="140dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imgMCat"
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#android:color/transparent"
android:layout_centerInParent="true"
android:layout_marginTop="3dp" android:layout_marginStart="3dp"
android:layout_marginEnd="3dp" android:layout_marginBottom="3dp"/>
<TextView
android:text="TextView"
android:id="#+id/mcategoryTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/imgMCat"
android:textAlignment="center"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
this photo for device

I found the answer here the problem was from CardView
https://stackoverflow.com/a/45769769/2209611
I add these attribute and fix the problem
app:cardBackgroundColor="#android:color/transparent"
app:cardElevation="0dp"

try this
<android.support.v7.widget.CardView
android:scaleType="centerInside"
android:layout_width="34dp"
android:layout_height="34dp"
android:clipChildren="false"
android:clipToPadding="false"
android:elevation="12dp"
android:shape="ring"
app:cardCornerRadius="17dp">
<ImageView
android:id="#+id/avatar"
android:layout_width="49dp"
android:layout_height="49dp"
android:layout_marginLeft="-8dp"
android:layout_marginTop="-5dp"
android:src="#drawable/blank" />
</android.support.v7.widget.CardView>

the image loads without a problem, what you need to do is set the height and width to wrap content instead of having a fixed width and a match parent height, here's what you should do in the xml
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp">
<ImageView
android:id="#+id/imgMCat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_centerInParent="true"
android:layout_marginTop="3dp" android:layout_marginStart="3dp"
android:layout_marginEnd="3dp" android:layout_marginBottom="3dp"/>
<TextView
android:text="TextView"
android:id="#+id/mcategoryTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/imgMCat"
android:textAlignment="center"/>
</RelativeLayout>
by setting the main layout to the sizes u want and then setting the imageview to wrap the content of the png you will have solved your problem
however, i would suggest that u never use fixed sizes for any UI components ever due to the amount of different devices with different screen sizes, if you use a fixed dimension UI elements then it's bound to be ruined on 1 screen or the other

overlapping a screen in android

In the below layout i have a text view named as scanning device.In that am displaying a device name But my device list was displaying above the screen .
can any one please help me how to scroll view should be inside the device list.while scrolling the screen it was displaying the list of the devices but it is displaying above the screen.
want to display inside a screen.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp"
android:text="#string/back"
android:textAllCaps="true"
android:textColor="#color/white"
android:visibility="invisible" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:padding="10dp"
android:textStyle="bold"
android:text="#string/lamp_list"
android:textAllCaps="true"
android:textColor="#color/white" />
<TextView
android:id="#+id/refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:drawableRight="#drawable/refresh"
android:gravity="right"
android:padding="10dp"
android:textAllCaps="true"
android:textColor="#color/white" />
<ProgressBar
android:id="#+id/scanningProgress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:background="#drawable/baground"
android:orientation="vertical">
<TextView
android:id="#+id/scan_status"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="18dp"
android:gravity="center"
android:text="#string/start_discovery"
android:textColor="#color/white"
android:visibility="gone"
tools:visibility="visible" />
<android.support.v7.widget.RecyclerView
android:id="#+id/deviceListView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
In the below layout connect textview was coming out of the layout.
device_item.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:padding="10dp">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:padding="6dp"
android:src="#drawable/lamp" />
<TextView
android:id="#+id/deviceName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left"
android:textColor="#color/white"
android:textSize="17sp"
tools:text="Solar Enviro SSL 2016" />
<TextView
android:id="#+id/connect"
android:layout_width="wrap_content"
android:layout_height="22dp"
android:background="#drawable/rounded_red_view"
android:text="#string/connect"
android:paddingBottom="1dp"
android:paddingTop=".2dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:textColor="#color/white"
android:textSize="17sp" />
</LinearLayout>

change this things..
used both wrap_content. i hope you also remove default action bar.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical">
<TextView
android:id="#+id/scan_status"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="18dp"
android:gravity="center"
android:visibility="gone"
tools:visibility="visible" />
<android.support.v7.widget.RecyclerView
android:id="#+id/deviceListView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>

Instead of CoordinatorLayout use linear layout.
if u r a beginner start coding with linear layout. It is easy to understand.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

layout_below in relative layout won't show

i'm trying to make a layout_below the cardview in relative layout but it wont show up in my device where layout_above works. i dont know why it wont work. i think it should be work because it below the cardview. please help what did i miss or wrong.
this is my xml code
<RelativeLayout 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/background_2"
tools:context=".ExchangeFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/saldo"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#drawable/holder" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:gravity="center_horizontal"
android:text="Will Stitch"
android:textSize="15dp"
android:textStyle="bold" />
</LinearLayout>
<android.support.v7.widget.CardView
android:id="#+id/saldo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_margin="20dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Saldo"
android:textColor="#color/colorPrimary"
android:textSize="20dp"
android:textStyle="bold" />
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/saldo"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="WillStitch#gmail.com"
android:textSize="10dp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
please help why it like this

It is working but your ImageView take all the width and it don't have android:src attribute (so it show nothing) and you don't need the last LinearLayout :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/saldo"
android:orientation="vertical">
<!-- Useless Linear Layout -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="WillStitch#gmail.com"
android:textSize="10dp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>

How place overlay imageview on two layouts?

I want to build the following screen which contains app logo, success/failure icon image, information message and ok button.
Here this the code. I am using linear layout to achieve this.
<LinearLayout
android:id="#+id/statusLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="#android:color/white"
android:weightSum="2"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:id="#+id/statusTopRelativeLayout"
android:background="#android:color/holo_blue_bright"
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:id="#+id/client_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/no_image_description"
android:src="#drawable/client_logo"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/statusBottomRelativeLayout"
android:background="#android:color/holo_blue_light"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<TextView
android:id="#+id/statusText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android:text="#string/statusText"
android:textSize="50sp"/>
<Button
android:id="#+id/btnOk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/statusText"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android:clickable="true"
android:focusable="true"
android:onClick="goToHomeScreen"
android:paddingBottom="15dp"
android:paddingTop="15dp"
android:text="#string/ok"
android:textColor="#ffffff"
android:textSize="40sp"/>
</RelativeLayout>
How to place success/failure icon image on top of the two layouts?

You can use constraint to make it easy
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.constraint.Guideline
android:id="#+id/center"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/center"
android:background="#ffffff"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="#id/center"
app:layout_constraintBottom_toBottomOf="parent"
android:background="#00ffff"/>
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#ff8801"
app:layout_constraintTop_toTopOf="#id/center"
app:layout_constraintBottom_toBottomOf="#id/center"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</android.support.constraint.ConstraintLayout>
Output:

Try this
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/nilu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:orientation="vertical"
android:paddingBottom="30dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
</LinearLayout>
<LinearLayout
android:id="#+id/nilu2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/nilu"
android:layout_weight="1"
android:background="#color/colorAccent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="NILU" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#mipmap/ic_launcher_round" />
</RelativeLayout>
</RelativeLayout>
OUTPUT

Parent RelativeLayout
add child LinearLayout as fillParent and assign weightsum 2. add two
layouts with 1 weight each. (add individual implementation for each
layout according to your requirements.)
add second child in relative
layout as imageview/button for that good sign and set it center in
parent.
This will fix your problem

Android:relative layout center things in their own space

I'm new to android and I would like to achieve something like this, where all thins are centered in their own space.
representative image
I've this code... How can I change it, and why?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="15dp"
tools:context="se.avatarcontrol.MainActivity">
<TextView
android:id="#+id/weather"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/light"
android:layout_marginTop="15dp"
android:text="RAINY" />
<Button
android:id="#+id/light"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="Light OFF" />
<TextView
android:id="#+id/frontText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#id/sideText"
android:text="FrontView"/>
<TextView
android:id="#+id/sideText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/light"
android:layout_marginTop="15dp"
android:layout_alignParentRight="true"
android:text="SideView" />
<ImageView
android:id="#+id/frontImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android: android:layout_below="#id/frontText"
android:src="**somesource**" />
<ImageView
android:id="#+id/sideImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/sideText"
android:layout_alignParentRight="true"
android:src="**othersource**"/>
</RelativeLayout>
Another thing would be how can my ImageViews fill all the space whithout overlapping each other?

please use FrameLayout or LinearLayout because it's lighter than RelativeLayout.
To achieve what you want, you should do something like :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- Weather light Layout-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:src="#mipmap/ic_launcher_round" />
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Light" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="2">
<!-- Front + Image Layout-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Front" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Image" />
</LinearLayout>
<!-- Side + Image Layout-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Side" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Image" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
This is the structure. Just adapt your padding / margin / ids and layout_height and width. For your case, i used layout_weight which is useful to specify a size ratio between multiple views.

Categories

Resources