Use a vertical line in a ListView item - android

I'm trying to show a vertical line in an android ListView item. I define it in the XML for the cell but when I preview it in the ListView it doesn't appear.
I understand this is an issue because I see alot of questions on here, but don't see any real answer.
The XML is pretty standard:
Cell:
<?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:background="#color/appWhite" >
<View android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#color/appGreen"
android:layout_alignParentLeft="true" />
<RelativeLayout
android:id="#+id/cell_trip_info_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/vertical_bar" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_trip_name"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:textColor="#2c3e50"
android:paddingLeft="10dp"
android:text="adfadf" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_trip_country"
android:layout_below="#+id/cell_trip_name"
android:textColor="#2c3e50"
android:paddingLeft="10dp"
android:text="adfadf" />
</RelativeLayout>
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:id="#+id/whole_container"
android:layout_alignParentRight="true" >
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/appGreen"
android:id="#+id/cell_trip_date_box"
android:layout_alignTop="#+id/update_buttons"
android:layout_alignBottom="#+id/update_buttons"
android:padding="20dp" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_tripstart_date"
android:layout_centerHorizontal="true"
android:textColor="#fff" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_date_thru"
android:text="#string/thru"
android:layout_below="#+id/cell_tripstart_date"
android:layout_centerHorizontal="true"
android:textColor="#fff" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_tripend_date"
android:layout_below="#+id/cell_date_thru"
android:textColor="#fff"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/update_buttons"
android:visibility="gone"
android:layout_toRightOf="#+id/cell_trip_date_box"
android:background="#e9e9e9"
android:padding="20dp" >
<ImageView android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/cell_button_edit_trip"
android:src="#drawable/slide_edit"
android:adjustViewBounds="true"
android:contentDescription="#string/content_description" />
<ImageView android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/cell_button_delete_trip"
android:src="#drawable/slide_delete"
android:layout_toRightOf="#+id/cell_button_edit_trip"
android:adjustViewBounds="true"
android:contentDescription="#string/content_description" />
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>

I found the cause and the obvious solution/workaround on another post Here
Basically RelativeLayouts for whatever reason won't play nice with the "match_parent" height setting in a ListView Item. One of the answer to the post recommended using a LinearLayout instead. So I just created a new File with the parent view being a LinearLayout. I then created a RelativeLayout child and tossed everything else in there.
It worked fine this time, easily allowing me to create my vertical rule.

In your cell_trip_info_container RelativeLayout you have
android:layout_toRightOf="#+id/vertical_bar"
You dont have a View named vertical_bar
Add that ID to your vertical bar view and you should be good to go
<View
android:id="#+id/vertical_bar"
android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#color/appGreen"
android:layout_alignParentLeft="true" />

change
RelativeLayout
to
VerticalLayout

Related

Android: fill relative layout height (item layout) inside ListView

I'm not able to make a View that fill the height of a RelativeLayout, which is the layout of ListView items. Here is my layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<View
android:id="#+id/fill_the_height_please"
android:layout_width="15dp"
android:layout_height="match_parent"
android:background="#color/red"/>
<TextView
android:id="#+id/delivery_list_item_dest"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/fill_the_height_please"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="2dp"
android:text="Destinatario" />
<TextView
android:id="#+id/delivery_list_item_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/delivery_list_item_dest"
android:layout_below="#id/delivery_list_item_dest"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:text="Location" />
<ImageButton
android:id="#+id/delivery_list_item_mapBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="0dp"
android:src="#drawable/map_location"
android:background="#null" />
View with id fill_the_height_please not fill the item height. In figure below you can see the result (nothing is shown):
I'd like something like this:
รน
I have also try to change view layout as follows but not works anyway:
<View
android:id="#+id/fill_the_height_please"
android:layout_width="15dp"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:background="#color/red"/>
Please can you help to achieve my goal? Thank you.
One suggestion would be add layout_alignTop="#+id/delivery_list_item_mapBtn" and layout_alignBottom="#+id/delivery_list_item_mapBtn" to the View and make it always fit the image height.
Try changing
android:layout_toRightOf="#id/delivery_list_item_statusBtn"
to
android:layout_toRightOf="#id/fill_the_height_please"
You don't have delivery_list_item_statusBtn. But i see red part even without changing this. Try it and if it doesn't help please post code of your adapter.
Looking here it seems RelativeLayout has a bug in version 17 and lower. So i have change my layout as follows:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<View
android:id="#+id/fill_the_height_please"
android:layout_width="15dp"
android:layout_height="match_parent"
android:background="#color/red"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:orientation="vertical" >
<TextView
android:id="#+id/delivery_list_item_dest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Destinatario"
android:layout_marginBottom="5dp" />
<TextView
android:id="#+id/delivery_list_item_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Location" />
</LinearLayout>
<ImageButton
android:id="#+id/delivery_list_item_mapBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="0dp"
android:src="#drawable/map_location"
android:background="#null" />
</RelativeLayout>
A little bit more complex but works. However i leave the question unresolved in case someone find a solution using only a RelativeLayout

Layout issue during AD load

I have a problem setting up layout.
Before AD is loaded it looks like this:
After AD is loaded, everything goes to it's place. It looks like this ( correct )
Does anybody know how to fix this problem? Not that only looks "ugly" for the time which AD is loading, but AD may never be loaded also, and layout could stay this way (first image )forever.
Any suggestions?
I have this XML layout:
<com.example.touch.TouchImageView android:id="#+id/mytouchview"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
android:layout_above="#+id/relat"
/>
<RelativeLayout
android:id="#id/relat"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:layout_above="#+id/myAdView"
>
<ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="3dp" android:layout_alignParentLeft="true"
android:background="#null" android:src="#drawable/previous" android:id="#+id/previous"/>
<TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:textSize="20sp" android:text="2/15"
android:id="#+id/memeNumber" android:layout_centerInParent="true" android:layout_margin="5dp"/>
<ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="3dp" android:layout_alignParentRight="true"
android:background="#null" android:src="#drawable/next" android:id="#+id/next"/>
</RelativeLayout>
<com.csjy.sfwn148282.AdView
xmlns:ap="http://schemas.android.com/apk/res-auto"
android:id="#id/myAdView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
ap:animation="fade"
ap:placementType="interstitial"
ap:banner_type="inappad"
ap:test_mode="true"
ap:canShowMR="false"
android:layout_alignParentBottom="true"
/>
EDIT:
After #Szymon answer layout looks like this. It's okay because it's the same while loading the AD. The problem is that now, buttons are missing..
Change your top level Relative Layout to a linear Layout (vertical) and then use layout_weight on the three layouts. set the layout_weight for mytouchview to 1 and the other two to 0. This will give mytouchview all the extra space and push the buttons and ad to the bottom. When the ad takes up space it will push the button tray up appropriately, but it won't take any space if the ad never loaded.
Try that one:
<?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" xmlns:app="http://schemas.android.com/apk/res/example.com">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_above="#+id/myAdView"
android:orientation="vertical" >
<com.example.touch.TouchImageView android:id="#+id/mytouchview"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
/>
<RelativeLayout
android:id="#id/+relat"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:paddingRight="10dp"
>
<ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="3dp" android:layout_alignParentLeft="true"
android:background="#null" android:src="#drawable/previous" android:id="#+id/previous"/>
<TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:textSize="20sp" android:text="2/15"
android:id="#+id/memeNumber" android:layout_centerInParent="true" android:layout_margin="5dp"/>
<ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="3dp" android:layout_alignParentRight="true"
android:background="#null" android:src="#drawable/next" android:id="#+id/next"/>
</RelativeLayout>
</LinearLayout>
<com.csjy.sfwn148282.AdView
xmlns:ap="http://schemas.android.com/apk/res-auto"
android:id="#id/myAdView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
ap:animation="fade"
ap:placementType="interstitial"
ap:banner_type="inappad"
ap:test_mode="true"
ap:canShowMR="false"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>

Problems with LinearLayout, views aren't resembling the preview in Graphical Layout on device

So I'm having a problem that is driving me crazy. Knowing the purpose of my app isn't important/relevant so I'll just paste my code from the xml file. The layout is a RelativeLayout, but the problem I'm having is inside of this LinearLayout.
Code:
<?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:orientation="vertical"
android:background="#drawable/background_orange"
android:id="#+id/rel_layout" >
<RelativeLayout
android:id="#+id/layout_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="false"
android:layout_centerHorizontal="true">
<ImageView
android:id="#+id/component_1"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:src="#drawable/source1"
/>
<ImageView
android:id="#+id/component_2"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_above="#id/component_1"
android:src="#drawable/source2"
android:layout_alignRight="#id/component_1"
android:layout_marginRight="-50dip"
android:layout_marginBottom="-25dip"
/>
</RelativeLayout>
<LinearLayout
android:id="#+id/problemIsHere"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="horizontal"
>
<EditText
android:id="#+id/edit_text"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="What&apos;s your question?"
android:imeOptions="actionDone"
android:inputType="textCapSentences|textAutoComplete"
android:textSize="25sp"
android:layout_gravity="left"
android:textStyle="bold" />
<ImageButton
android:id="#+id/image_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dip"
android:layout_weight="0"
android:layout_gravity="right"
android:background="#drawable/source3"
/>
</LinearLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#id/problemIsHere"
android:gravity="center"
>
<ImageView
android:id="#+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/source4"
android:onClick="computeUserInput" />
<ImageButton
android:id="#+id/image_button0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/image_view"
android:layout_alignTop="#id/image_view"
android:layout_marginLeft="-2dip"
android:background="#drawable/voice_recognition_touse"
/>
</RelativeLayout>
Again, this is nested inside of the parent, RelativeLayout. In the preview, when clicking on the "Graphical Layout" tab, this looks like exactly what I want; EditText to the left of a small ImageButton, with correct proportions and margins. However, when I run this on my device, the LinearLayout is REVERSED, meaning now that the EditText is to the RIGHT of the ImageButton. The proportions and margins are still accurate though. Does anyone know what is going wrong here?
Note: I've already cleaned and refreshed my project; this was ineffective. I've also tried removing the layout_gravity attributes, and that did nothing.
Thanks

How to hide all elements in a Layout in Android at once?

I'm developing an Android app in eclipse.
I have an XML which has 2 linear layouts next to each other. The left one has several buttons, which make content visible in the right. However, I would not only like these buttons to make specific content visible, but hide (setVisibility.GONE) all the other stuff in that layout. I have already tried removeAllViews, but this is not suitable for me since it deletes them. So my idea is to hide (set the visibility to gone) every single stuff, then make the ones I wish visible. The reason I ask this is that it takes too much time setting the visibility to gone for everything (24, actually) for all the 12 buttons.
Thanks in advance
Layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/alap"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView3"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imageView4" >
<LinearLayout
android:layout_width="197dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lewis" />
<Button
android:id="#+id/first"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/first" />
<Button
android:id="#+id/second"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/second" />
</LinearLayout>
</ScrollView>
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:scaleType="center"
android:src="#drawable/cpr1" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:scaleType="center"
android:src="#drawable/epizodok" />
<LinearLayout
android:id="#+id/def"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView3"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/scrollView2"
android:layout_toRightOf="#+id/scrollView2"
android:orientation="vertical"
android:visibility="visible" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lewis"
android:visibility="gone" />
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:visibility="gone" />
</LinearLayout>
</RelativeLayout>
Please try this...
<LinearLayout
android:id="+id/ll"
android:layout_width="197dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- All content which you hide/show put here -->
</LinearLayout>
now in your class file you read this.
LinearLayout ll = (LinearLayout) findViewById(R.id.ll);
after that as per your requirement you hide/show this Layout with their all contents.
like:
For Hide.
ll.setVisibility(View.GONE);
For Show.
ll.setVisibility(View.VISIBLE);
when you hide/show LinearLayout all content with this Layout also hide/show automatically.
Simply, Just take another Linear Layout with vertical layout within your "def" Linear layout..Nd change its visibility as per your need.
<LinearLayout
android:id="#+id/def"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView3"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/scrollView2"
android:layout_toRightOf="#+id/scrollView2"
android:orientation="vertical"
android:visibility="visible" >
<LinearLayout
android:id="#+id/Subdef"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lewis"
android:visibility="gone" />
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:visibility="gone" />
</LinearLayout>
</LinearLayout>
No need to hide views instead of that just use ViewFlipper concept.
Just declare view flipper in your xml file with your two linearlayouts like this
<Viewflipper android:id="#+id/myViewFlipper" android:layout_height="wrap_content" android:layout_width="match_parent">
<LinearLayout android:id="#+id/layout1" android:layout_height="wrap_content" android:layout_width="match_parent"></LinearLayout>
<LinearLayout android:id="#+id/layout2" android:layout_height="wrap_content" android:layout_width="match_parent"></LinearLayout>
</Viewflipper>
And get viewflipper reference in your java code like this
Viewflipper mFlipper = (Viewflipper)findViewById(R.id.myViewFlipper);
use mFlipper.showNext(), use mFlipper.showPrevious() methods to hide and show your layouts thats it.

ListView inside a ScrollView issue in Android

Here is my XML layout. I have a list view inside my scrollview. I am setting the height manually if I change the listview height to wrap_content it is not working. And also if the data grows beyond the limit it is hiding. I am seeing many answers to solve this. What is the best option to solve it for my case?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:focusableInTouchMode="true" >
<LinearLayout
android:id="#+id/store_scroller"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="#c6c6c6"
android:padding="10dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
layout_alignParentLeft="true"
android:text="Stores"
android:textSize="20dp" />
<TextView
android:id="#+id/merchant_count_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="0 Results" />
</RelativeLayout>
<Gallery
android:id="#+id/gallery1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:gravity="left"
android:listSelector="#color/gridviewlistselector"
android:paddingLeft="10dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
android:spacing="10dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="#c6c6c6"
android:padding="10dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
layout_alignParentLeft="true"
android:text="Products"
android:textSize="20dp" />
<Spinner
android:id="#+id/filter_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:layout_toRightOf="#+id/textView1" />
<TextView
android:id="#+id/product_count_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="0 Results" />
</RelativeLayout>
<ListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="4800dp"
android:layout_weight="1"
android:drawSelectorOnTop="true"
android:listSelector="#color/gridviewlistselector"
android:orientation="vertical" />
</LinearLayout>
</LinearLayout>
</ScrollView>
Short answer: You can't (shouldn't) have a ListView wrapped in a ScrollView.
Long answer: As Romain Guy (UI-guru at Google themselves) once said:
Using a ListView to make it not scroll is extremely expensive and goes against the whole purpose of ListView. You should NOT do this. Just use a LinearLayout instead.
Quote via "How can I put a ListView into a ScrollView without it collapsing?".
Instead using List View in ScrollView you can make separate layout where you can define your desired components. then you can make that layout haeder of the ListView. You can use following code:
LayoutInflater inflater = LayoutInflater.from(this);
View LTop = inflater.inflate(R.layout.header_tolistview, null);
listview.addHeaderView(LTop);

Categories

Resources