Problems with RelativeLayout Android - android

I am new to Java and Android and I am facing this problem:
I would like to add a photo to the top/left corner of a Rectangle. However, the ImageView of my photo gets always more space and so, it creates a blank space on top that I would not like to have. Here is a screenshot:
The code of my Layout is:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="25dp">
<ImageView
android:id="#+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/profile_frame" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView1"
android:layout_centerVertical="true"
android:src="#drawable/foto_facebook_juan_mejorada" />
</RelativeLayout>

Try this:
android:scaleType="fitStart"
android:adjustViewBounds="true"

It may be because of
size of the image. If the image not fit in the space given it will add blank space.

// try this way
<?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:gravity="center">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="30dp">
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/profile_frame" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:src="#drawable/foto_facebook_juan_mejorada" />
</FrameLayout>
</LinearLayout>

Related

Images are not getting displayed in android xml file

I am trying to design as shown in below figure,i have a linear layout,inside that i am adding two images,over each image i am adding text view.But as per below code image doesnt even appear in xml file(i have added image in drawable folder),What i am missing here?Please help me..
.xml file
<?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="#C5C5C5">
<TextView
android:text="Desing view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="300dp"
android:id="#+id/linearLayout1"
android:background="#c5c5c5">
<ImageView
android:src="#drawable/img"
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/imageView1" />
<ImageView
android:src="#drawable/img"
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/imageView2" />
</LinearLayout>
</LinearLayout>

Trying to draw an arbitrary background image

I've already seen many tutorials trying to put an image as background of my main activity. Tested many ways, and now I'm with this:
<?xml version="1.0" encoding="utf-8"?>
<merge
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:src="#drawable/library"
android:scaleType = "centerCrop"
android:contentDescription="#string/bckgrndimg" />
<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="#ffffff"
android:orientation="vertical"
>
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="370dp"
android:layout_marginLeft="0dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true">
</ListView>
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nuevo_libro"
android:id="#+id/nuevoLibro"
android:layout_above="#android:id/list"
android:layout_centerHorizontal="true"
android:layout_marginBottom="42dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/biblioteca_virtual"
android:id="#+id/textView2"
android:layout_above="#+id/nuevoLibro"
android:layout_centerHorizontal="true"
android:layout_marginBottom="31dp" />
</RelativeLayout>
</merge>
Ok, this should go ok, shouldn't it? My "library" image is a 900x600 PNG image, but it just doesn't show up on the screen.
Am I missing something?
Thank you!
Do you need an Image View?
You could do something like this:
<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/library.."
...
>
...
</RelativeLayout>
Change Background color of RelativeLayout
android:background="#ffffff"
To
android:background="#android:color/transparent"

Make ImageView take up all available vertical space and grow width to scale up/down proportionally in RelativeLayout

I'm targeting API level 21 and min is also 21 (I support Lollipop only for now, it's a pet project to learn).
I'm having problems with a custom ListView item layout. Here is my XML:
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content">
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:background="#FF0000"
android:src="#drawable/ic_test"
tools:ignore="ContentDescription"/>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/test_list_item_icon"
android:textSize="50sp"/>
</RelativeLayout>
And here is what it looks like (the icon's red background color is only to see how big the actual view is):
I would like the image view to behave like the following: take up the available vertical space at the 'start'/left of the layout, have the image scale proportionally, and have the width be grown so that the image can be fully shown, like this (pardon my gimp skills):
Is it possible?
Try this for your ImageView
<?xml version="1.0" encoding="utf-8"?>
<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">
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:background="#FF0000"
android:src="#drawable/ic_test"
android:adjustViewBounds="true"
android:scaleType="fitXY"
tools:ignore="ContentDescription"/>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/test_list_item_icon"
android:textSize="50sp"/>
</RelativeLayout>
In the end I decided to create one more icon size, xxxhdpi, and it all looks nice now.
Many thanks to #corsair992 for information about the bug in one of the comments.
HI wujek the reason for your problem is you set height as wrap content for your relative layout . so it will take the textview's height as its height .then image view will use this as its height .so change relative layout height to match parent. Please try and let me know thanks
<?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" >
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:adjustViewBounds="true"
android:background="#ff0000"
android:src="#drawable/ic_launcher"
tools:ignore="ContentDescription" />
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/layout_1"
android:gravity="center"
android:text="bhsbd"
android:textSize="50sp" />
try this
if u want to image should capture imageview size use background insted src.
if red background is mandatory use another relative layout as parent for imageview.
hope it works fo u..
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content" >
<RelativeLayout
android:id="#+id/layout_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#FF0000" >
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:background="#drawable/ic_launcher"
android:adjustViewBounds="true"
tools:ignore="ContentDescription" />
</RelativeLayout>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/layout_1"
android:textSize="50sp" />
</RelativeLayout>
edit 2
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content" >
<RelativeLayout
android:id="#+id/layout_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/test_list_item_name"
android:layout_alignTop="#+id/test_list_item_name"
android:background="#FF0000" >
<ImageView
android:id="#+id/test_list_item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher"
android:adjustViewBounds="true"
tools:ignore="ContentDescription" />
</RelativeLayout>
<TextView
android:id="#+id/test_list_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/layout_1"
android:textSize="50sp"
android:text=" text 5>" />
</RelativeLayout>
Define a LineatLayout with weightsum.
<LinearLauyout
----
android:orientation="horizontal"
android:weightSum="5">
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4">
</LinearLayout>
you can adjust the weightsum as per your requirement.

Can not get ImageView to display

My intent is to create a list of widgets on a scroll view, with an ImageView in the centre of the screen behind them. Here is what I have, there will be more buttons when all is said and done:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:contentDescription="#string/description"
android:src="#drawable/myImage"
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="centerInside" />
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#android:color/transparent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:background="#android:color/transparent">
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/newButton"
style="#style/homeScreenButton"
android:text="#string/new_profile" />
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/loadButton"
style="#style/homeScreenButton"
android:text="#string/load_profile" />
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/calculatorButton"
style="#style/homeScreenButton"
android:text="#string/calculator" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
On eclipse's xml graphical layout interpreter, the screen is shown as expected. The same is true with the 2 different emulators that I tried, Android 2.2 and Android 4.0.3. But when I send to my actual device, Droid 4 w/Android 4.1.2 the image simply does not show up. I even tried making the ScrollView transparent (android:alpha="0") thinking that it was somehow covering the image up, but nothing. Any suggestions would be greatly appreciated.
try eliminating this line from ImageView,
xmlns:android="http://schemas.android.com/apk/res/android"
it should be present only in the RelativeLayout
so your xml file become
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:contentDescription="#string/description"
android:src="#drawable/myImage"
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="centerInside" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="#android:color/transparent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:background="#android:color/transparent">
<Button
android:id="#+id/newButton"
style="#style/homeScreenButton"
android:text="#string/new_profile" />
<Button
android:id="#+id/loadButton"
style="#style/homeScreenButton"
android:text="#string/load_profile" />
<Button
android:id="#+id/calculatorButton"
style="#style/homeScreenButton"
android:text="#string/calculator" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
I figured it out, the code was fine. My problem was that the image was in /res/drawable but it needed to be in /res/drawable-hdpi.

Overlay image over another android

I have photo album which shows the image as rounded with white border. Image will be adding dynamically. I tried frame layout but it it not working for me. My try : Adding dynamic image over already existing round shape image..
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="#+id/image"
android:layout_width="60dip"
android:layout_height="60dip"
android:adjustViewBounds="true"
android:scaleType="centerCrop" />
<ImageView
android:id="#+id/imagef"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#drawable/ph_bg" />
</FrameLayout>
Above xml not giving exact result .. any idea ?
Use below xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/image"
android:layout_width="60dip"
android:layout_height="60dip"
android:adjustViewBounds="true"
android:layout_centerInParent="true"
android:scaleType="centerCrop" />
<ImageView
android:id="#+id/imagef"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerInParent="true"
android:background="#drawable/ph_bg" />
</RelativeLayout>
This will do your task.
Happy coding :)
Try setting foreground and background on only one ImageView.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/your_img_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/the_actual_image"
android:src="#drawable/the_image_overlay" />
</RelativeLayout>

Categories

Resources