RelativeLayout takes fullscreen with layout_height="80dp" - android

I'm trying to create a fragment with height of 80dp, and at Design section it seems to work pretty well, but when I run the app on my device, RelativeLayout somehow takes a fullscreen. I use android:layout_alignParentBottom="true" for the SeekBar, but as far as I know it shouldn't take fullscreen if Layout's height isn't wrap_content. Here is the XML code:
<?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="80dp"
android:background="#bbbbff">
<SeekBar
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/progressBar"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="#+id/playButton"/>
<Button
android:layout_width="60dp"
android:layout_height="60dp"
android:text="play"
android:layout_alignParentRight="true"
android:id="#+id/playButton"/>
</RelativeLayout>
EDIT 1: I just tried to use this layout for an activity and it doesn't take fullscreen anymore, but I still have a problem with fragment. Also, I don't change Layout's height programmatically.
EDIT 2: I use fragmentTransaction.add(R.id.musicBarContainer, musicProgressBar) to add the fragment to activity, where musicProgressBar is an instance of fragment java class. The musicBarContainer XML code is
<FrameLayout
android:id="#+id/musicBarContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
</FrameLayout>
In onCreateView I use View view = inflater.inflate(R.layout.music_progress_bar, null);

From the RelativeLayout doc:
Class Overview
A Layout where the positions of the children can be described in relation to each other or to the parent.
Note that you cannot have a circular dependency between the size of the RelativeLayout and the position of its children. For example, you cannot have a RelativeLayout whose height is set to WRAP_CONTENT and a child set to ALIGN_PARENT_BOTTOM
Class documentation
Which is exactly your case. RelativeLayout can not do that.
for more detail visit this answer : RelativeLayout is taking fullscreen for wrap_content

In MusicProgressBar fragment class, instead of
View view = inflater.inflate(R.layout.music_progress_bar, null);
you should write
View view = inflater.inflate(R.layout.music_progress_bar, container, false);

Try setting the height of seekbar to 20dp and check. I think its wrap_content is overriding the parents height parameter somehow.

Related

FrameLayout with two children( Some View and a ProgressBar, with only one visible at any moment). How to set LayoutParams properly

If I want to show a View with content which takes time to fetch, I'd usually include it in a FrameLayout with a ProgressBar alongside. Show the progressBar while fetching and show the view once the content become available.
Example with a textView.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:clickable="true">
<TextView
android:id="#+id/addressTv"
android:layout_width="match_parent"
android:minLines="4"
android:maxLines="4"
android:layout_height="match_parent"/>
<ProgressBar
android:id="#+id/addressLoadingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true" />
</FrameLayout>
In this example only one of 'addressTv' or 'addressLoadingBar' is showing at any given moment, the other one is 'GONE'.
But I can't figure out how to make the FrameLayout have a fixed height. In this case the max of the children's heights. With the above layout, it changes when we switch between the children.
I suggest switching to RelativeLayout, with both children being visible when the layout is inflated. Then set the one not needed to invisible, and change once it is ready. Then make the progress bar invisible.
You have a circular dependency problem - your FrameLayout height is wrap_content while your TextView height is match_parent. You may want to change your TextView height to wrap_content
As #Disco mentioned in the comments, using View.INVISIBLE instead of View.GONE will probaly fix problem. When view is "gone", it just disappear from the view hierarchy, while when it is "invisible", it cannot being seen, but is still there logically, so layout dependent upon the invisible view are not effected by it's "disappearance".

ImageView in SurfaceView without XML

My question is if is possible add an ImageView in a SurfaceView without XML. If yes, how? I have a main class that has the function of GamePanel, and for apply a Method i need to call it with an ImageView, but i don't know if it is possible. Thanks you in advance.
You need to read about the View and ViewGroups provided by the Android Framework.
I am giving the quick understanding to propose the solution.
Crash Course about View & ViewGroup
At the root of the Android UI system, everything is View.
What is a View?
It is a single widget / UI component that can be displayed on the screen. The View includes Buttons, TextViews, ImageViews, SurfaceView. They can not contain any child view i.e. They can not hold declaration for the any other child view
Following XML definition is incorrect: A view can not hold another view
<SurfaceView
android:id="#+id/textSurfaceView"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</SurfaceView>
What is ViewGroup?
Inherited from View and designed to contain and arrange more than one View also called as Child views. The various ViewGroups are LinearLayout, RelativeLayout, FrameLayout etc.
Following XML definition is Correct: A ViewGroup can hold another view
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<SurfaceView
android:id="#+id/surfaceView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageView android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</FrameLayout>
Here comes the solution
Step-1: Add a ViewGroup in your XML wrapping the existing SurfaceView. As mentioned already the ViewGroups are LinearLayout, RelativeLayout, FrameLayout etc.
res/layouts/your_layout.xml
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/baseFrame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<SurfaceView
android:id="#+id/surfaceView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</FrameLayout>
Step-2: At the time of view creation add an ImageView to the FrameLayout. onCreate() activity.
setContentView(R.layout.your_layout);
FrameLayout baseFrame = (FrameLayout) findViewById(R.id.baseFrame);
ImageView imageView = new ImageView(this);
imageView.setWidth(/*As per your need*/);
imageView.setHeight(/*As per your need*/);
imageView.setId(/*Any unique positive Number*/ R.ids.imageView1); <= Required to access this view later
/*Set the layout parameters such as layout_gravity as well.*/
baseFrame.addView(imageView);
Step-3: I know you must be wondering about the ImageView Id. I am giving the quicker way to assign an ID to a View.
Create a file ids.xml at res/values
Fill the following details.
<resources>
<item type="id" name="imageView1" />
</resources>
Step-4: Passing an ImageView to the method
ImageView myImageView = (ImageView) findViewById(R.id.imageView1);
methodToBeCalled(myImageView);
I hope that helps.
Happy Coding!!!

RelativeLayout takes all its space, even though I've set its height to "wrap_content"

Background
I have a RelativeLayout inside a FrameLayout/RelativeLayout (doesn't matter to me), which should be at the bottom of the screen (like a toolbar), and should hold a few views in it.
Its height is set to "wrap_content" and so does its child-views.
The child-views of this layout are : A textView that is on the left, and a Horizontal LinearLayout on the right with a few buttons.
The problem
It seems that no matter what I do, the textview is causing the RelativeLayout to take the whole space, instead of just its children.
The code
Here's the minimal XML content that causes this problem. I've removed the extra stuff (LinearLayout and its children, and also some attributes that don't matter) since they don't cause this problem in case I remove the TextView:
<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:background="#FF000000" >
<!-- Here I've put some views that don't have any relation with the views below, so it doesn't have anything with do with the problem -->
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/vertical_gradient_transparent_to_black" >
<!-- Here I've put a LinearLayout that doesn't cause the problem, so I've removed it for simplicity-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
</RelativeLayout>
I've tried many possible attributes, and also tried adding additional layouts to try to "fool" the RelativeLayout, but none of those have succeeded.
The question
Why does it occur?
A working solution would be to use a Horizontal LinearLayout (with a weight for the TextView ) instead RelativeLayout , but I still want to know why can't I use a RelativeLayout, and why it occurs. Also how to fix it while still using RelativeLayout.
From the RelativeLayout doc:
Class Overview
A Layout where the positions of the children can be described in relation to each other or to the parent.
Note that you cannot have a circular dependency between the size of the RelativeLayout and the position of its children. For example, you cannot have a RelativeLayout whose height is set to WRAP_CONTENT and a child set to ALIGN_PARENT_BOTTOM
Class documentation
Which is exactly your case. RelativeLayout can not do that.
I have encountered the same issue before, this might be caused by android:layout_alignParentBottom attribute.Maybe you can find another way to achieve your desired effect. See this for more information.
This is some kind of Strange issue. Maybe someone else has the explanation.
I found it working when i removed the line
android:layout_alignParentBottom="true"/>
and it also worked when i tried some like this
<TextView
android:layout_width="match_parent"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"/>

A layout with a image background isnt responding on size change

I've a layout (tab from now on) wich has a background (204px x 54px).
I've set that tab to many sizes:
At the moment it's set to 70dp x 40dp:
As you can see, on the XML its displaying somehow like it should be viewed in the device, but when I run it, it ignores the width and the height, so it's being displayed as it is originally (probably takes width & height from the background image).
However, those tabs are placed inside a LinearLayout, so I inflate it several times and I add it into the tabsContainer layout.
<LinearLayout
android:id="#+id/tabsContainer"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" >
</LinearLayout>
As you can see, I've set a 40dp height and it's working. Its streching the tab layout BUT I also want to reduce the tab's width.
As you can see in the picture, the last one tab's width is kinda smaller because it's in the "end" of the tabsContainer.
Can you give me any tip?
UPADTE
Now my tab layout is like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#drawable/inactiu_docs"
android:clickable="true"
android:gravity="center" >
<TextView
android:id="#+id/titlePestanya"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="2dp"
android:text="Producto simple"
android:textColor="#color/black" />
And this is the code I'm using to inflate:
RelativeLayout pestanya = (RelativeLayout) this.mInflater.inflate(R.layout.pestanya_per_inflar, null);
I've tried to do it like:
RelativeLayout pestanya = (RelativeLayout) this.mInflater.inflate(R.layout.pestanya_per_inflar, tabsContainer);
But it's crashing with error:
android.widget.LinearLayout cannot be cast to android.widget.RelativeLayout
SOLVED
Use this when inflating:
inflate(R.layout.pestanya_per_inflar, tabsContainer, false);
And use the previous XML layout.
If your parent is a LinearLayout, then you should use android:layout_width="0" and android:layout_weight="1" on your tabs.
When you inflate, make sure you pass a parent.
Hope this helps.
EDIT: never inflate without passing a parent or you will lose your xml parameters (LEARN MORE)

Android RelativeLayout and height of wrap_content?

I am trying to make a selection ListActivity, similar to the one used to add shortcuts to the launcher screens. I have rolled my own header and footers, which I would like to be "sticky" at the top and bottom of the view when on screen. In order to do this, I am using a RelativeLayout with the header set to dock to top, footer set to dock to bottom, and the list set to go below the header and above the footer. In terms of the overall layout of the activity, this is rendering as I would expect. The header is sticky to the top, the footer is sticky to the bottom, and the list scrolls in between them.
One odd thing though happened when I switched to the RelativeLayout as my root. Please see the following screenshot:
I want my Activity's height to be wrap_content, so that the form is only as high as the content displayed in it, but once i switched to RelativeLayout, it seems to render the Activity effectively as fill_parent, taking up the whole screen, even though the content doesn't warrant it. Notice that there are not enough list items to fill the screen, which with the fill_parent style, is leaving a bunch of whitespace between the end of the list, and the footer. I was setting my height's via styles - which worked fine with LinearLayout, but seems to be ignored now. So I tried hard-coding the height directly on the RelativeLayout, but it still doesn't work and still renders as fill_parent.
Here is my layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/GroupsList"
android:layout_height="wrap_content">
<FrameLayout android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:id="#+id/hdrGroups"
android:layout_alignParentTop="true">
<include layout="#layout/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</include>
</FrameLayout>
<FrameLayout style="#style/MyFooter"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_alignParentBottom="true"
android:id="#+id/ftrGroups">
<ImageView style="#style/CloseButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/add"
android:id="#+id/imgGroupsAdd"
android:clickable="true">
</ImageView>
</FrameLayout>
<ListView android:divider="#9f9f9f"
android:id="#+id/android:list"
android:choiceMode="singleChoice"
android:dividerHeight="1dp"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_below="#id/hdrGroups"
android:layout_above="#id/ftrGroups">
</ListView>
<TextView android:text="#string/browser_no_groups"
style="#style/ListedItemB"
android:id="#+id/android:empty"
android:layout_height="wrap_content"
android:layout_above="#id/ftrGroups"
android:layout_below="#id/hdrGroups"
android:layout_width="fill_parent">
</TextView>
</RelativeLayout>
All layout is done via XML, ... I am not doing any layout in code.
How can I get the sticky header and footer while also having the activity as a whole behave in a wrap_content mode for its height? Is there some other way I should be going about this instead of a RelativeLayout?
According to the developer documentation your desired behaviour is not possible for Relative layout ;
"Note that you cannot have a circular dependency between the size of
the RelativeLayout and the position of its children. For example, you
cannot have a RelativeLayout whose height is set to WRAP_CONTENT and a
child set to ALIGN_PARENT_BOTTOM."
RelativeLayout
To solve your problem you could maybe try to use a linear layout, set to wrap_content and set max height via code to screen height.
You can get the screen height as described here : get screen height
I just change my RelativeLayout in FrameLayout and all starts to work

Categories

Resources