Two Layouts on Android Screen - android

I am trying to make an application that will have a set of screens that are similar in the fact that they will have a layout at the top, and at the bottom will have a set of buttons. Basically what happens is that one of the buttons at the bottom is a spinner, and each of the options that gets selected should inflate a layout into the top half of the screen, while leaving all of the buttons at the bottom.
What is the best way of going about this, without having to rewrite the part of the xml for the buttons at the bottom of the screen.
From the image above, I need the five buttons at the bottom to stay the same for all screens, while everything above it needs to be changed when one of the options is selected from the spinner.
My code currently is as follows: It currently puts up the buttons at the bottom, and the text in the red box, which will be on every screen. What I need to do is inflate the personal layout into the space in between.
setContentView(R.layout.people1);
if (v.getId() == R.id.service_user_button)
{
Spinner spinner = (Spinner) findViewById(R.id.people_spinner);
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(
getBaseContext(), R.array.service_user_array, android.R.layout.simple_spinner_item);
adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
spinner.setAdapter(adapter);
}

You want your layout to look something like this:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<LinearLayout
android:id="#+id/theContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</ScrollView>
<!-- Buttons go inside this -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
At runtime you lookup the LinearLayout with the id 'theContent' and assign it's children to it.

You can also use the <include> tag. Check this explanation by Romain Guy.

There exists one more additional (not alternative!) possibility. The whole activity screen is always inserted into a FrameLayout. So, you can use as a root layout Merge instead of a root layout. The layout with buttons will have large top margin, so they will be placed at the bottom. Other layouts will be at the top, as they are. The theory is described here.
Of course, the common bottom layout should be placed into include.

Related

Adding bottom margin to ListView last element

I need to add to add ListView with complicated items background: different for even/odd and rounded corners at the top and bottom. It looks like this:
I have implemented all this stuff via level-list, but there is one more thing I want to do.
Now the bottom item is near the bottom of the screen. It is better to add some space.
I don't want to add bottom margin to ListView, I need margin only for last item.
The ways I see to do this:
Footer
A kind of hack – add footer with empty TextView to ListView. But footers are quite unstable things, they usually disappear after notifyDataSetChanged and there is no way to get them back
Image with transparent pixels
I asked designer to add transparent pixels to bottom background resource. Unfortunately, in this case vertical centering is completely broken.
For example, there is 9patch like this:
And layout like this:
<?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"
>
<!-- View with background with transparent pixels on bottom -->
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
android:id="#+id/item"
android:background="#drawable/some_bgr"
android:padding="10dp"
>
<TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1"
android:text="Title"
android:layout_gravity="center"
android:textSize="18sp"
/>
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="Detail"
android:layout_gravity="center"
android:textSize="18sp"
/>
</LinearLayout>
<!-- Just for marking place took by view -->
<FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"
android:layout_below="#id/item"
android:background="#88ff55"
/>
</RelativeLayout>
The result:
As you see, centering is not working. Unfortunately.
(BTW, if specify this 9patch as background for TextView, centering works good. If you know any article, explaining this, please let me know.)
Add bottom margin to last item in Adapter implementation
That should work, but for unknown reason I still can't get it work.
I don't like this way, because I don't like to modify dimensions in code.
So
There is already imaginary way – construct some XML drawable with particular bitmap and margin. According to drawables concept it should be possible, but I can't find implementation. May be somebody knows?
Any other ideas?
In your ListView, set a paddingBottom and clipToPadding="false".
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="8dp"
android:clipToPadding="false"
android:scrollbarStyle="outsideOverlay"/>
This also works for RecyclerView.
Only use android:scrollbarStyle="outsideOverlay" if you want the scroll bar to not overflow into the padded area.
add an empty footer in your list like this:
TextView empty = new TextView(this);
empty.setHeight(150);
listview.addFooterView(empty);
you can also do it from code if you want, for example here I react to
to EditText different situations:
if(s.toString().length()>0)
{
contacts_lv.setClipToPadding(false);
contacts_lv.setPadding(0,0,0,270*screenDensity);
}
else
{
contacts_lv.setClipToPadding(true);
contacts_lv.setPadding(0,0,0,0);
}
Clocksmith's answer is the best and pretty clever. You can also create an empty footer view.
Add these two lines in your listView XML code:
android:transcriptMode="alwaysScroll"
android:stackFromBottom="true"
Another solution might be that you make a mock view with certain height.
In your adapter in getViewCount return 2.
In getCount return yourData.size+1.
In getViewType check if the element is last element return 2;
Use this type in getView to populate the mockview.
I guess you want to add margin only to last item:
So you can do in this manner, in your getview method the index of the list item and check if its the last item, then progrmatically add margin to the view.

unwanted side margins of my custom listview item layout

I'm getting some weird left and right side margins when using a custom listview item layout. They are margins (or at least not padding of the container), since the background doesn't extend to the edge.
In this layout, I'm using a simple vertical LinearLayout with a bunch of textviews and a progressbar. If I switch back the built-in simple_list_item_activated_1.xml, the margins disappear. The linear layout itself doesn't have any layout margins. I specifically stripped it of any attributes, leaving only the id, the layout_width="match_parent" and layout_height="wrap_content", and the margins were still there.
Is there anything I'm missing here?
A screenshot of the problem can be seen here:
Edit 1: #Grishu: As I've said earlier, these margins appear even with a very simple layout, such as this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/some_text"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
I just typed this from memory, so it might contain syntax errors. But you get the idea.
Edit2: I just went over all my layouts. The problematic margin was set on one of the parent containers, thus it has nothing to do with list items. Sorry for the spam.
i had a similar problem with a listview item layout, it looked fine in the graphical layout in eclipse, i solved it by setting:
android:layout_margin="0dp"
android:padding="0dp"
in the main relative layout, hope this helps.

How to place fixed button below listview?

Is there any way to have a button directly below a listview, so that as the listview grows, the button moves down BUT the button is never pushed off screen. IE, once the listview has outgrown the screen, the button is still always visible, and the listview is scrollable.
I have managed to make the button ALWAYS at the bottom of the screen, but i want it to sit up directly below the listview while the listview is smaller than the screen.
I have tried using various arrangements of relative and linear layouts and using the weight property, and things that seem like they should work simply don't, so it might be worth checking any answers before posting.
CLARIFICATION:
To phrase it in a different way: I want a button to sit below a listview, moving down as it grows, but i dont want the button to be pushed offscreen
This previous post does exactly what you want to do. What it does basically is that it keeps the button at the bottom of the list at all times. But when the list grows out of the screen area, its height gets limited by the weight parameter.
This way, the list's bottom edge is just above the button's LinearLayout and you get the same behavior that you were looking for.
If You Want to show this button in the end of list item. Then use this code
final Button btnAddMore = new Button(this);
btnAddMore.setText(R.string.art_btn_moreIssues);
exArticlesList = (ExpandableListView) this.findViewById(R.id.art_list_exlist);
exArticlesList.addFooterView(btnAddMore);
OR If you show button in your layout end then use this code.
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/listView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/btn_New" >
</ListView>
<Button
android:id="#+id/btn_New"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginBottom="20dp"
android:text="#string/New"
android:width="170dp"
android:layout_alignParentBottom="true" />
</RelativeLayout>

Scrolling up and down the ListView loses the top and bottom items in the list - Screenshot attached

I have an activity with the following items:
Action bar (one imageview, one view and two imagebutton) displayed on top of the activity, and for the rest of the screen I have one ListView. This is all placed in main.xml layout. The list will always have 6 rows no more and the action bar is not visible on this activity.
The listview loses text/images from some rows when scrolling up and down.
Before scrolling (I had to hide the logo though, sorry)
Before scrolling http://img706.imageshack.us/img706/37/32572081.png
After scrolling down and up (note DGL Lookup text disappear)
after first scrolling http://img638.imageshack.us/img638/7334/4scrollup.png
After scrolling down and up again (note DGL Lookup is still not there and Hazard Classes graphic and text disappear too
scrolling again and again http://img839.imageshack.us/img839/4970/5scrolldownagain.png
If I keep scrolling up and down, rows might show up again and might disappear as well.
here is my main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFF"
android:orientation="vertical" >
<include layout="#layout/action_bar" />
<ImageView
android:id="#+id/splashscreen"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
</ImageView>
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:cacheColorHint="#00000000"
android:textColor="#000" >
</ListView>
</LinearLayout>
Any quick help! I am very new to Android
#Frankenstein: Thanks for your help, you gave me the thread head and I followed it until the I got the solution.
The issue was that the listview display certain number of rows on a screen, and display more rows as you scroll up and down using getView method. The new rows displayed will normally take the style of the rows they are replacing.
So, if row1 has a different font style than others, then the row that will take it's place will inherit the same font style. What you may do, check if this is a different row that shouldn't inherit the style and then change the style to what you like.
Check this article http://android.amberfog.com/?p=296 which will explain what I just said in a technical way

Extend UI of an View

I would like to extend the UI of AutoCompleteTextView. The Functionality is fine, all I need is to add an button to the right that looks like a drop-down button. Sadly AutoCompleteTextView has a 'natural' margin that I can't reduce to 0.
What can I do now?
Dose I have to overwrite onDraw() & onMeasure() to archive my goal (is there an easier way)?
You could put both AutoCompleteTextView and button onto FrameLayout, add some extra margin right to AutoCompleteTextView to make FrameLayout slightly bigger, and align button to parent right. In fact, these 2 views will interfere, but for user they will appear one next to the other w/o any margin.
Another option could be to set custom background to AutoCompleteTextView (probably modified original one taken from Android source with removed margin).
Just remembered that you can supply negative margin. You can put both views onto LinearLayout and set left margin of button to -5dp for example. However, you will still have to supply custom marginless background for button.
you can use RelativeLayout to put Button to the right of AutoCompleteTextView
Sample
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/btn_close_pressed"
android:layout_alignParentRight="true"
android:id="#+id/myBtn"
></Button>
<AutoCompleteTextView android:id="#+id/myautocomplete"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:completionThreshold="1"
android:layout_toLeftOf="#+id/myBtn"
/>
</RelativeLayout>

Categories

Resources