I want to make a listview with semi-transparent cells (some sort of blue with 25% opacity).
The listview is created correctly but, when i perform an scroll motion(I press and drag down or up) the list seems to activate some sort of selection mechanism witch applies a black and opaque background to the list.
Any Idea how I can get rid of this?
Below is the code and the two screens:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical" android:background="#drawable/background">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:background="#drawable/my_health_title">
</ImageView>
<ListView android:id="#+id/health" android:layout_width="wrap_content"
android:layout_height="wrap_content">
</ListView>
<TextView android:id="#+id/health_title" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:textColor="#46727c"
android:textSize="14sp" android:textStyle="bold"
android:layout_marginTop="20dp" android:layout_marginLeft="30px"
android:text="Blood presure Profile">
</TextView>
<LinearLayout android:id="#+id/health_gauge"
android:layout_width="250dp" android:layout_height="35dp"
android:layout_centerVertical="true" android:layout_marginLeft="20dp">
</LinearLayout>
<TextView android:id="#+id/health_description"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:textColor="#46727c" android:textSize="12sp" android:textStyle="normal"
android:layout_marginTop="150px" android:layout_marginLeft="30px"
android:text="Looks Goood">
</TextView>
<ImageView android:id="#+id/health_details"
android:background="#drawable/home_arrow_icon_margin"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentRight="true" android:layout_centerVertical="true">
</ImageView>
normal list
selected efect
I was having a nightmare with a similar problem. But I was adding the ListView dynamically, and
android:cacheColorHint="#00000000"
didn't work in this case. The solution:
Don't add ListView dynamically, cacheColorHint will not work
Hope this helps someone!
Just set the android:cacheColorHint to #00000000 on your ListView.
Notice that the color code is an 8 digit code (#AARRGGBB), which means that the first two digits represents the alpha of the color. (If you set it to a 6 digit, #000000 it won't help, because it will be still opaque. For more info on color codes click here).
Your list view should look like this:
<ListView android:id="#+id/health" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000">
</ListView>
More details and explanation can be found here.
Related
I've tried to track down what's going wrong here, and I'm coming up with nothing. If i change my layout weight from 1 to 2, on the first view in my horizontal linear layout, the resulting width actually decreases. Here is the code.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:weightSum="7">
<TextView android:id="#+id/filterButton"
android:layout_width="0dp"
android:layout_weight="2"
android:layout_height="wrap_content"
android:padding="0dp"
android:textColor="#android:color/white"
android:text="filter"></TextView>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="4"
android:layout_height="fill_parent"
android:gravity="center" >
<AutoCompleteTextView
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:ems="14"
android:imeOptions="actionDone"
android:inputType="textAutoComplete|textAutoCorrect"
android:textColor="#FFFFFF"
android:singleLine="true"
android:gravity="left">
</AutoCompleteTextView>
<ImageView android:id="#+id/clear"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/close"
android:layout_alignParentRight="true"
android:scaleType="fitEnd"
android:adjustViewBounds="true"
android:padding="12dp"
android:visibility="invisible"
android:tint="#android:color/white"/>
</RelativeLayout>
<ImageView android:id="#+id/listButton"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:src="#drawable/list"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:padding="9dp"
android:tint="#android:color/white"></ImageView>
</LinearLayout>
Here is what my action bar looks like with the TextView's layout weight set to 1.
You can see I'm already getting some overflow on the right element. It's getting bumped off screen. Here is what it looks like with the TextView's weight set to 2.
Which is odd because the TextView has actually decreased in size. Here is the action bar without the TextView. The sizes are behaving well here.
Any help would be greatly appreciated!
It looks similar to problem i have sometimes.
For layout with weight 7 it would give space like that [[..2..][.5]].
Like in your example making weight smaller actually give more space for layout.
Try to change background color of the middle layout to have better grasp what space exacly is given to your layouts.
Unlucky on my computer your code works normally so I can't help more than that.
I want to create a list view layout with a image and title in it. I want a layout like listview in google io 2014 app. It should be a tiled listview with some colour till the image gets loaded, after the image is loaded it should be shown in the upper half of the listview and title should be shown below with some background colour. I am attaching the screenshot of google io app here.
Updated: If somebody can point me some template custom layout for this listview it would be helpful!
Create a custom list with all the needed controls in separate layout and inflate it using a custom adapter you can find a small example here
you could create a custom layout something like this
<?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:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:background="#drawable/images"
android:layout_height="match_parent"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#862c10">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:textSize="15sp"
android:layout_marginLeft="10dip"
android:textStyle="bold"
android:text="HTML5 everywhere how and why android users use the webplatform" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:textSize="15sp"
android:layout_marginLeft="10dip"
android:layout_marginTop="10dip"
android:text="Wed 5 2001" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:textSize="15sp"
android:layout_marginLeft="10dip"
android:layout_marginTop="10dip"
android:text="Steven roberts and mark robinson " />
</LinearLayout>
</LinearLayout>
(this should not be the answer, but forgive me I could not add a comment, and actually I hope this will give him the answer).
First of all I guess you didn't get on well with using ListView and Adapter in Android. So I suggest you to read the following article first:
ListView tutorial 1
ListView tutorial 2
They will teach you how to use xml to define your custom row view. Then you will know how to use George Thomas's xml. Try how to implement the getView() method.
How to create the Layout like the (Android ICS Contacts Favorite layout )image i attached
am using the grid view for creating the layout for the photos grid. Thats perfectly working. But
how can i create the overlay layout like the black transparent with name or image ?? any one guide me to do this
Thanks in advance
Try this: (Note: this is the Custom XML Layout for the GridView that will be setup in the Adapter)
<FrameLayout
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:gravity="center" >
<ImageView
android:id="#+id/imgProfilePicture"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:src="#drawable/ic_contact_picture" >
</ImageView>
<TextView
android:id="#+id/txtUserName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:background="#50000000"
android:gravity="center"
android:text="User Name"
android:textColor="#ffffff"
android:textSize="11sp" >
</TextView>
</FrameLayout>
And it will look this:
This is as-is from one of my apps. Play around with the android:layout_width and the android:layout_height to set your own size. Also, fiddle with this android:background="#50000000" attribute to get it looking as you please. The 50 in it is the alpha that will set the transparency.
I have this ListView whose items i'd like to hide depending on the selection of a RadioGroup. Currently I'm passing a boolean to the ListAdapter due to the RadioGroup having only two options. My items contain a checkbox and i want to either show the entire list or just the ones with the check boxes checked. I'm succeeding at hiding the items but the dividers still show, how can i fix this?
Look how it looks like
http://www.mediafire.com/i/?wa2s0ngq027vjwr
http://www.mediafire.com/i/?9i6ggj2fdsns2da
(I'm new, so i can't upload images here)
The xml for my row would be:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:padding="1dip" android:gravity="center_vertical"
android:background="#FFF">
<CheckBox android:id="#+id/dispositivo_tv"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:textColor="#000000" android:textSize="15dip"
android:layout_alignParentLeft="true" />
<LinearLayout android:id="#+id/botones"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:layout_alignParentRight="true" android:gravity="center_vertical">
<ImageButton android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/button_foto"
android:src="#drawable/camera" android:background="#FFF"
android:paddingRight="15dip" android:visibility="invisible"></ImageButton>
<ImageButton android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/button_comentario"
android:src="#drawable/comment_add" android:background="#FFF"
android:paddingRight="15dip"></ImageButton>
</LinearLayout>
</RelativeLayout>
and the xml block for the ListView would be:
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="horizontal"
android:padding="5dip" android:background="#layout/list_box">
<ListView android:id="#android:id/list" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:cacheColorHint="#00000000"
android:headerDividersEnabled="false" android:footerDividersEnabled="false
</ListView>
</LinearLayout>
and what i use to hide the row when the boolean i told you about is set FALSE is:
wrapper.getDispositivo().setVisibility(View.GONE);
wrapper.getFoto().setVisibility(View.GONE);
wrapper.getComentario().setVisibility(View.GONE);
PS: wrapper is the instance of the class where i have all the elements of the row, i.e. the checkbox (getDispositivo()), and a couple of image buttons (getFoto(), getComentario())
Thanks in advance...
How about using custom dividers in your relative layout and setDivider(null); so once you hide the layout the dividers are hidden as well. I wanted to actually add this as a comment. But it comes only after 50 reps so had to put it as a answer.
I am trying to modify the design of Spinner widget. I can change the background, but I can't find a way to change the arrow icon on the right side. Is there a way to do it?
Thanks!
The whole thing is a single 9 patch png image. I've modified the entire look of spinners before by replacing the images. See this page: http://androiddrawableexplorer.appspot.com/
Specifically look at btn_dropdown_normal.9, btn_dropdown_pressed.9, btn_dropdown_selected.9 and btn_dropdown_disabled.9
You just need to provide your own versions of those images.
Also, you can place your "spinner bar" layout in a FrameLayout, together with the real spinner but set to invisible:
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="32dip"
>
<Spinner
android:id="#+id/theSpinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:visibility="invisible"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="32dip"
android:background="#drawable/my_background"
android:padding="6dip"
android:clickable="true"
android:onClick="spinnerBarReplacementClicked"
>
<ImageView
android:id="#+id/replacementSelectImg"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#drawable/my_drawable"
/>
<TextView
android:id="#+id/replacementSelectText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="4dip"
android:layout_toLeftOf="#id/replacementSelectImg"
android:textColor="#000000"
android:textSize="14sp"
android:ellipsize="marquee"
android:singleLine="true"
/>
</RelativeLayout>
</FrameLayout>
and pass the clicks from your layout to the real spinner
private Spinner mSpinner;
mSpinner = (Spinner) findViewById(R.id.theSpinner);
public void spinnerBarReplacementClicked(View pV){
mSpinner.performClick();
}