My ListView backgrounds go black during scrolling - how to fix? - android

Ive specified white backgrounds for pretty much all widgets and it works, except when scrolling. The background container goes black during scrolling resulting in annoying flickering.

You will need to use the setCacheColorHint() method of ListView.
Example: list.setCacheColorHint(yourBackColor);
Explanation of the issue and solution here

ScrollingCache="false" in your activity's *.xml file for the list object should do the trick, too.

I fixed this problem by making the background color of the cells the same color as the ListView, so:
<?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:orientation="vertical"
android:background="#FFFFFF">
<ListView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FFFFFF"> <---- Background color of ListView
</ListView>
</LinearLayout>
and then the row:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="8dip"
android:background="#FFFFFF"> <--- Background color of the cell
<LinearLayout
android:id="#+id/projects_cover_row_image_layout"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:background="#444444"
android:layout_centerInParent="true"
android:layout_marginRight="8dip">
<ImageView
android:id="#+id/projects_cover_row_image"
android:layout_width="50dip"
android:layout_height="50dip"
android:contentDescription="#string/projects_image_content"/>
</LinearLayout>
...
</RelativeLayout>
that completely got rid of the problem for me and seems like the best solution

Just put background on the top and no highlight or other bad effects simple and no need of hint or cache
in listview layout
android:background="#000000" for black background or android:background="#FFFFFF" for white
<?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:background="#000000"
android:orientation="vertical" >
<TextView
android:id="#+id/testscheck"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:layout_weight="1"
android:layout_gravity="left|center"
android:gravity="left"
android:textColor="#color/ics"
android:textSize="14sp"
/>
</LinearLayout>

Related

android GridView issue show rows

I'm working with gridView, each item has an image and a TextView in the footer.
All images have the same size, so I use match_parent or wrap_content as required.
But the screen only show one line and a half on items, it scroll, and that is perfect, but I would like to show two complete rows and then scroll.
Also, when I run the app in small devices, only show 1 line, I would like to show 2 lines always.
I tried to use this example, but it doesn't work to me because stop scrolling.
Here, some of my code XML
<?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="match_parent"
android:background="#drawable/bg_app">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black"
android:id="#+id/header"
android:padding="10dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/icon_back"
android:src="#drawable/ic_back" />
</RelativeLayout>
<com.xetux.util.ExpandableHeightGridView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:horizontalSpacing="15dp"
android:isScrollContainer="true"
android:numColumns="3"
android:padding="10dp"
android:id="#+id/family_grid_view"
android:layout_below="#+id/header"
android:verticalSpacing="15dp"/>
<!--<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
android:id="#+id/family_grid_view"
android:horizontalSpacing="15dp"
android:verticalSpacing="15dp"
android:layout_below="#+id/header"
android:numColumns="3"/>-->
</RelativeLayout>
and each item XML:
<?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="match_parent"
android:id="#+id/family_image"
android:background="#drawable/bg_family">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black_transparency"
android:text="FAMILIA"
android:gravity="center"
android:id="#+id/family_name"
android:padding="10dp"
android:layout_alignParentBottom="true"
android:textColor="#color/white"
android:textSize="15sp"/>
</RelativeLayout>
I think your image size is big. You can checkout for supporting multiple screen tutorials. Try using small images for small screen.

layout_below item inside included layout

I'm trying to figure out a way to align an item in a layout in respect to an item within an included layout.
Here's a visual representation:
And here is example code that I'm looking for (which obviously doesn't work):
Main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<include
android:id="#+id/info"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/info" />
//This would be the dark grey box
<RelativeLayout
android:layout_below="#id/item1">
</RelativeLayout>
</RelativeLayout>
included.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="50dp">
<ImageView
android:id="#+id/item1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingLeft="100dp"/>
</RelativeLayout>
I'm assuming the best way to accomplish this would be through dynamically positioning the dark grey box in code, but I have no idea where to start. Any help would be awesome.
Can you make this below your include? Something like this (instead item1 use info):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<include
android:id="#+id/info"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/info" />
//This would be the dark grey box
<RelativeLayout
android:layout_below="#id/info">
</RelativeLayout>
</RelativeLayout>

Background losing color if there's another layout inside

Say I want to make one layout inside another one with different background colors, but once I add a background color to the inner layout ( frameLayout6 in this case ), the outer layout's background becomes transparent...
any ideas what might be wrong?
Thanks!
<FrameLayout
android:id="#+id/frameLayout5"
android:layout_width="160px"
android:layout_height="160px" android:background="#FFFFFF" android:layout_marginLeft="20px">
<FrameLayout
android:id="#+id/frameLayout6"
android:layout_width="match_parent"
android:layout_height="match_parent" android:layout_margin="5px">
</FrameLayout>
</FrameLayout>
The inner layout (frameLayout6) is over framelayout5 so if you set a background in the inner layout, you can't see the framelayout5.
Edit:
I don't know why this behavior happen but you can do that
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout android:id="#+id/frameLayout5"
android:layout_height="160dp"
android:layout_marginLeft="20dp" android:layout_width="160dp">
<View android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#ff00ff"/>
<RelativeLayout android:layout_width="fill_parent"
android:background="#ff0000" android:layout_height="fill_parent"
android:layout_margin="50dp" android:drawingCacheQuality="auto">
</RelativeLayout>
</RelativeLayout>
</LinearLayout>

Button at Bottom

Im not very good in creating android layouts so I am not able to align the button to the bottom in the MainView.
Picture:
Layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/linearLayout1" android:layout_width="fill_parent" android:layout_height="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical">
<ListView android:id="#+id/lv_pizza" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_weight="1"></ListView>
<Button android:layout_width="fill_parent" android:id="#+id/bt_add"
android:layout_height="wrap_content" android:text="hinzufügen"></Button>
<RelativeLayout android:layout_width="fill_parent" android:id="#+id/relativeLayout2" android:layout_height="fill_parent">
</RelativeLayout>
</LinearLayout>
Please help
This works for a linear layout, note the layout_weight 1 on the list -- that's what pushes the button to the bottom:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ListView android:id="#+id/lv_pizza"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button android:id="#+id/bt_add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="hinzufügen" />
</LinearLayout>
This then looks like this in the UI editor:
Hi you can set like this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="#+id/linearLayout1" android:layout_width="fill_parent" android:layout_height="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical">
<ListView android:id="#+id/lv_pizza" android:layout_width="fill_parent"
android:layout_above="#+id/bt_add" android:layout_height="fill_parent" ></ListView>
<Button android:layout_width="fill_parent" android:id="#+id/bt_add"
android:layout_gravity="bottom" android:layout_height="wrap_content" android:text="hinzufügen"></Button>
</RelativeLayout>
Removing the RelativeLayout will push the button to bottom of the screen...
Use a layout_weight for the components inside the LinearLayout. If the ListView has a weight of 1.0, it should push the button to the bottom. I've done this with a ScrollLayout and it works well, allowing the component inside the scroll layout to actually scroll. You could put your ListView into a ScrollLayout to let it grow beyond the visible size.
Also, the second relativelayout also isn't necessary as it doesn't add anything.
You can set a marginTop in the Button until the bottom or change the layout to relative and set the position.

Hiding the main layout of Custom Dialog

I have made layout for custom dialog, it has inside two imageview. I want to show both Imageview when dialog appear. and i want to hide the main layout of my xml file I have used "#00000000" as background:color, but it is not working.
Is there any way to do the same?
Thanks.
Here is my layout. I have taken screen shot please have a look i want to hide the border which are showing in image.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent"
android:orientation="vertical" android:background="#00000000">
<LinearLayout android:id="#+id/linearLayout1"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
<ImageView android:id="#+id/img_closeimage" android:src="#drawable/product_zoom_close"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:clickable="true"></ImageView>
</LinearLayout>
<LinearLayout android:id="#+id/linearLayout2"
android:layout_marginLeft="25dip" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_marginTop="-5dip" android:layout_marginBottom="20dip" android:layout_marginRight="20dip">
<ImageView android:id="#+id/img_ProductZoom" android:src="#drawable/index"
android:layout_width="wrap_content" android:layout_height="wrap_content"
></ImageView>
</LinearLayout>
</LinearLayout>
image description here
Adinias comment is correct, your layout has quite some redundancy. You also say that you only want to show an imageview, but your layout contains two imageviews. If you only want to show one imageview, then your layout should look like this:
<?xml version="1.0" encoding="utf-8"?>
<ImageView android:id="#+id/img_ProductZoom" android:src="#drawable/index"
android:layout_width="wrap_content" android:layout_height="wrap_content"
/>
If you want to show two ImageViews, use this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent"
android:orientation="vertical" android:background="#00000000">
<ImageView android:id="#+id/img_closeimage" android:src="#drawable/product_zoom_close"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:clickable="true"/>
<ImageView android:id="#+id/img_ProductZoom" android:src="#drawable/index"
android:layout_width="wrap_content" android:layout_height="wrap_content"
/>
</LinearLayout>
Your current layout looks the way it does because you have specified the layout to take as much space as possible with android:layout_height="fill_parent" and android:layout_width="fill_parent". Try to use wrap_content as height and width instead.

Categories

Resources