Im trying to have a searchbox on the top of my list view. But I want this searchbox to disapear sometimes and the listview to resize to regain space. Is there a way I can do that without reloading another and different layout ???
is there a way to add and remove a component from the current view ?I have been playing with setvisibility but it doesnt resize anything.
Please, if you know, give code example ! :)
I did this with a layout like this
<RelativeLayout android:id="#+id/editFrame"
android:layout_width="wrap_content"
android:layout_below="#id/imageAttachments"
android:layout_height="wrap_content"
>
<EditText android:id="#+id/editText"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
></EditText>
</RelativeLayout>
<ListView android:id="#+id/ListView01"
android:layout_below="#id/editFrame"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
></ListView>
Then, in the code, do the following:
findViewById(R.id.editText).setVisibility(View.GONE);
to free up the space, or
findViewById(R.id.editText).setVisibility(View.VISIBLE);
to show the search box.
Instead of the EditText, one can as well use any other single control or a layout for a combination of controls.
Setting its visibility to GONE will make the surrounding editFrame layout (can as well be a FrameLayout) shrink to zero size and reclaim the space for the ListView (which is set to be layout directly below the editFrame layout).
Related
Firstly, I am new to android so if I have missed something basic I apologise.
I have a page which has two ListViews side by side, both with varying amounts of content. I also have a TextView above the ListViews and another TextView below the listviews. These text view boxes change based on items selected in either of the two ListViews.
These two ListViews sit side by side, taking up half of the screen each, while a Textview sits directly above and directly below, both centred to the page. An image is shown below.
This is the page looking normal on load.
The problem is when I select an item from either list. I have a feeling I am missing some XML properties, but I am not sure which properties or if this is even the case. When an item is selected, let's say from the ListView on the right, the TextView at the bottom is updated with text taken from an array. The ListView also decides to change the width and I am not sure why this is.... I don't want the ListView to change width. I want it to remain taking up half of the page and half of the page only.
This is the page after an item from the right ListView has been selected.
I would also like to keep things in RelativeLayout. I also believe it is only an XML issue and not to do with the adapter or any other code so I will not include that for now. I can include it if required.
Any help would be great. Thanks in advance.
content_titles.xml my activity xml file
<?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"
tools:context=".TitlesActivity">
<ListView
android:id="#+id/unlocked_titles_list"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:longClickable="true"
android:layout_below="#+id/current_title"
android:layout_alignEnd="#+id/requirements"
android:layout_marginEnd="26dp"
android:layout_above="#+id/requirements">
</ListView>
<TextView
android:id="#+id/current_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="65dp"
android:text="Current Title: Novice"
android:textSize="24sp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"/>
<ListView
android:id="#+id/locked_titles_list"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignStart="#+id/requirements"
android:layout_marginStart="28dp"
android:layout_above="#+id/requirements"
android:layout_below="#+id/current_title"/>
<TextView
android:id="#+id/requirements"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="34dp"
android:text="temp"
android:textAlignment="center"
android:textSize="24sp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
activity_listview.xml used as the individual rows of the ListViews
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/label"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dip"
android:textSize="16dip"
android:textStyle="bold" >
</TextView>
The problems with layout could be caused by ScrollView to be the wrapper
I stumbled upon some note in http://developer.android.com/reference/android/widget/ExpandableListView.html
"...Note: You cannot use the value wrap_content for the android:layout_height attribute of a ExpandableListView in XML if the parent's size is also not strictly specified (for example, if the parent were ScrollView you could not specify wrap_content since it also can be any length. However, you can use wrap_content if the ExpandableListView parent has a specific size, such as 100 pixels."
I removed wrapping ScrollView and linear layout started working properly. Now its only to understand how to wrap the stuff to ScrollView. God help me
But anyway this is really weird behavior. I think that fill_parent is not really correct wording. When using heirarchyviewer tool I always see WRAP_CONTENT and MATCH_PARENT values for layout_width and leayout_height. So probably fill_parent is actually means match_parent which puts me in cognitive dissonance.
You have your layout_width properties set to wrap_content. This means that they could change as the data changes. I would recommend putting your ListViews in a LinearLayout with orientation:horizontal and set the amount of space that each element takes up with layout_weight. Here is a relevant SO question What does android:layout_weight mean?
I've to design a UI for an Android app where i've 10 vertical tiles containing image and text(the 2 big boxes in the picture) and on clicking a tile, it disappears and is replaced by scrollable gridview containing 6 elements(shown in the centre of figure below) on the same page. (shown by an animation)
Here is a snapshot of the view I'm trying to explain. This images shows only 2 out of 10 tiles and a gridview which appears on click Each of the white box contains image and text. I'm not good at designing, so a detailed answer of implementing this would be appreciated. Thanks.
There is not much details in your question, even the picture does not clarify everything, but here is a stab at it.
Not sure what you mean when you say the tiles "expand" further, do you expect to see the six tiles in the middle to appear at that time or are they always there? if they appear, would that be animated?
To achieve the picture you have, you should probably get a RelativeLayout at the top level.
That's just because you have this date TextView on the top right and the handle to a SlidingDrawer at the bottom. You can set the background of that RelativeLayout with your wallpaper theme and I guess the blue bar on top if that's static.
Then inside this top-leve RelativeLayout you have a LinearLayout with an horizontal orientation. This one will contain the three "windows" on your picture.
In that horizontal LinearLayout, first you have another LinearLayout with a vertical orientation, then a ViewPager and then another vertical LinearLayout similar to the first one (not sure how the right part is different from the left one or that is supposed to be a complete mirror... ?).
So in summary:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/top_level"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<TextView
android:id="#+id/date_text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:paddingTop="..." // fill in some space to offset from the top of the screen
android:paddingRight="..." // same thing to keep it off the right edge
/>
<LinearLayout
android:layout_height="..." // set the height of your content in the center of your screen
android:layout_width="fill_parent"
android:layout_below="#+id/date_text"
android:orientation="horizontal" >
<LinearLayout
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:orientation="vertical" >
< add here some of the stuff you have above your tile like that RSS icon and so on />
<ListView
android:id="#+id/tile_list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
</LinearLayout>
<ViewPager
android:id="#+id/pager"
android:layout_height="fill_parent"
android:layout_width="0dp"
android:layout_weight="1" // so that will fill the remaining space between the left and the right parts
/>
<LinearLayout
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:orientation="vertical" >
< add here some of the stuff you have above your tile like that RSS icon and so on />
<ListView
android:id="#+id/tile_list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"/>
</LinearLayout>
</LinearLayout>
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:handle="#+id/drawer_handle"
android:content="#+id/drawer_contents">
<ImageView
android:id="#+id/drawer_handle"
android:src="#drawable/image for the tab..."
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ImageView>
<Another Layout for the content of the drawer
android:id="#+id/drawer_contents"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
....
</Close that layout>
</SlidingDrawer>
</RelativeLayout>
From there, there is still quite a few things to fill up and some code to write to fill the lists of tiles (on the left and right), handle when the user click on an item, and then also display the content of the ViewPager in the middle of the screen. You'll probably want to use a GridLayout in each page there.
If you need to hide that ViewPager until the user click on some tile, you can set the visibility to hidden and change it in your code.
UPDATE
Now there is more information on how this moves......
OK, so keep the top level RelativeLayout with the date and the SlidingDrawer at the bottom.
In the middle part, you can use the HorizontalListView that was put together by this person: How can I make a horizontal ListView in Android?, the code and instructions and example can be found here: http://www.dev-smart.com/archives/34
Then you need to create your own Adapter to populate that List. You can base it off the BaseAdapter (that decision is more dependent on how your images / information is stored).
In the getView function of that Adapter, can have a layout where both the collapsed and expanded views are combined into one FrameLayout, but only one is visible at a time. It will look like something like this:
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent" // assuming the HorizontalListView is set with the right height
>
<LinearLayout
android:id="#+id/collapsed_view"
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:orientation="vertical" >
< add here some of the stuff you have above your tile like that RSS icon and so on />
</LinearLayout>
<ViewPager
android:id="#+id/expanded_view"
android:layout_height="fill_parent"
android:layout_width="0dp"
android:layout_weight="1" // so that will fill the remaining space between the left and the right parts
android:visibility="gone"
/>
</FrameLayout>
In the list adapter, you will need to set proper tags to the different views, so when a user clicks on one image, you know which one was clicked. To expand one view, you change the visibility of the LinearLayout to gone and the one of the ViewPager to visible.
If there should only be only one expanded at a time, you can have a state variable in your Adapter to say which one it is and set the visibility properties correctly for all the views in the list. Then you call invalidate on the ListView to have it refreshed.
There is quite a bit of code to write to do all this, but if you keep it organized, it should not be too bad....
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>
I've got the following xml file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:background="#android:color/transparent"
android:layout_marginTop="0px"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="1"
android:orientation="horizontal">
<Button android:id="#+id/info" android:text="Info" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom"></Button>
<Button android:id="#+id/town" android:text="Town" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom"></Button>
<Button android:id="#+id/unit" android:text="Unit" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom"></Button>
<Button android:layout_height="wrap_content" android:text="EndTurn" android:id="#+id/endturn" android:layout_width="wrap_content" android:layout_gravity="bottom"></Button>
</LinearLayout>
which provides the following result: http://i42.tinypic.com/otdkb4.png
Now I've got some questions about this:
The top and bottom padding, how to get rid of it?
I tried RelativeLayout, multiple layouts within each other, padding, margin, changing height nothing seem to affect it in any way.
Is there a way to get the layout transparent? android:background seems to be the wrong one.
Between the third and the fifth button is a bit more space (where the fourth button should be). I catch it the in the program and set it to invisible.
unitButton.setVisibility(INVISIBLE);
unitButton.setWidth(0);
Now the space between the two buttons is more than double of the normal range (between 1 and 2) Any idea on this? - Altough this is a minor problem
Thanks in advance.
1: Is the layout presented in a Dialog? If so, that'll give you some headaches. To get more control you should either create your own custom Dialog extension (as some dialog layout values are hardcoded), or display your layout in another way (a new activity on top, or using a framelayout perhaps)?
2: To get a layout transparent, simply don't give it a background-attribute. (Though, if you really are using a dialog, the dialog box is not transparent, and it is that which you see. You can also set it to be transparent by setting background to "#00000000" (which is what you do).
3: A View with visibility as "invisible" is still measured, that means both its width/height as well as its margins and padding is displayed as empty space in your layout. Setting the visibility to "gone" instead will not measure it, and you won't need the setWidth(0) either. (You can still display it later by setting it back to "visible")
Edit: removing the unused "weightSum" attribute might also be a good idea, as the view is now expecting its children to have a total weight of something other than 0.
How does Android determine whether to move the layout up when showing the softkeyboard?
Note: I am aware that the activity property android:windowSoftInputMode="adjustResize|adjustResize|adjustUnspecified"
exists, as described here http://developer.android.com/guide/topics/manifest/activity-element.html#wsoft
, but in my case it doesn't seem to have any effect. This is my problem:
I have two activities, pretty much the same layout, but the first one is using a ListView that holds a list of buttons. The second activity holds a scrollview with buttons.
The rest is the same, same number of buttons, same height of elements, etc.
Now, when I press the search button to open the search input bar, in my first activity, the entire layouts gets moved up.
While on the second activity, the layout is not being moved up but the softkeyboard just displays on top of it. This is actually how I want it to behave. How can I achieve the same with my activity that's using the ListView?
In my manifest, initially I didn't specify any android:windowSoftInputMode attribute, but even if I do, it doesn't make any difference; I tried all three values (adjustPan, adjustResize, adjustUndefined, without any difference).
This is my layout:
1) http://pastebin.com/5zzVxjbK
2) http://pastebin.com/KFtPuHvP
Interestingly though: when I set my ListView visibility in my layout 1 (left) to View.INVISIBLE, then the layout doesn not get moved up!
I can achieve this with a RelativeLayout and setting android:windowSoftInputMode="adjustPan" like so:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent" >
<include android:id="#+id/Header" layout="#layout/header"
android:layout_width="fill_parent" android:layout_height="wrap_content" />
<ListView android:id="#+id/android:list" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_below="#id/Header"
android:layout_above="#+id/Footer" />
<include android:id="#id/Footer" layout="#layout/footer"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
</RelativeLayout>
You may be able to achive this by setting the footer gravity (or layout_gravity) to "bottom", if you want to keep the LinearLayout, but I am not sure.