Fresco image not visible in Recyler View on Android Jellybean devices - android

While loading image a thin line appears and the image is not visible while using fresco in a RecyclerView on Android Jellybean devices but the same works on KitKat+ devices.
Samsung - 4.1.1 - API 16 - 768 X 1280
SamsungGalaxyNote2 - 4.3 - API 18 - 720 X 1280
NOTE : Have tested in multiple devices and the scenario is the same
This is the way we are using it in the library
if (newsModelStoreList.get(position-1).getImageUrl() != null) {
String imageUrl = newsModelStoreList.get(position-1).getImageUrl();
String extension=".jpg";
try {
extension = imageUrl.substring(imageUrl.lastIndexOf("."));
}
catch (Exception e)
{
}
Log.d("extension: ",extension);
if(extension.equals(".gif")) {
Log.d("Detected Gif: ", "Starting gif controller");
DraweeController controller = Fresco.newDraweeControllerBuilder()
.setUri(Uri.parse(imageUrl))
.setAutoPlayAnimations(true)
.build();
myHolder.newsImage.setController(controller);
}
else
{
myHolder.newsImage.setImageURI(Uri.parse(imageUrl));
}
}
I AM 100% SURE THAT URL IS AVAILABLE AND IS WORKING ON 4.4+ DEVICES
This is the news_layout.xml which gets inflated
<?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="wrap_content"
android:background="#color/feed_bg"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg_parent_rounded_corner"
android:layout_marginTop="#dimen/feed_item_margin"
android:orientation="vertical"
android:paddingBottom="#dimen/feed_item_padding_top_bottom"
android:paddingTop="#dimen/feed_item_padding_top_bottom" >
<LinearLayout
android:layout_width="fill_parent"
android:gravity="right"
android:layout_height="wrap_content">
<TextView
android:id="#+id/timestamp"
android:gravity="right"
android:paddingRight="10dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="posted 5 min ago"
android:textColor="#color/timestamp"
android:textSize="#dimen/feed_item_timestamp" />
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/newsTitle"
android:textSize="22dp"
android:clickable="false"
android:textStyle="bold"
android:paddingLeft="#dimen/feed_item_status_pad_left_right"
android:paddingRight="#dimen/feed_item_status_pad_left_right"
android:textColor="#color/black"
android:textColorLink="#color/com_facebook_blue"
android:layout_marginBottom="5dp"
android:paddingBottom="5dp"
/>
<TextView
android:id="#+id/newsInformation"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dp"
android:textColor="#color/black"
android:textColorLink="#color/com_facebook_blue"
android:paddingLeft="#dimen/feed_item_status_pad_left_right"
android:paddingRight="#dimen/feed_item_status_pad_left_right"
android:paddingTop="#dimen/feed_item_status_pad_top" >
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/viewMore" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_gravity="right"
android:layout_height="wrap_content">
</LinearLayout>
SimpleDraweeView is used here ...
<com.facebook.drawee.view.SimpleDraweeView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:visibility="visible"
android:adjustViewBounds="true"
android:id="#+id/newsImage"/>
The rest of the xml is just for reference just in case it would help
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/pad_5dp">
<TextView
android:id="#+id/awesomeness"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/timestamp"
android:text="Awesomeness: "
android:textSize="#dimen/feed_item_timestamp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/awesomenessCountNumber"
android:text="0"
android:textColor="#color/timestamp"
android:textSize="#dimen/feed_item_timestamp"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/pad_5dp"
android:layout_marginLeft="#dimen/pad_5dp"
android:layout_marginRight="#dimen/pad_5dp">
<Button
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/awesomeButton"
android:layout_marginRight="8dp"
android:background="#drawable/awesome_button_2"/>
<Button
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/facebookSharePost"
android:layout_marginRight="8dp"
android:background="#drawable/facebook_icon"
/>
<Button
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/whatsApp"
android:background="#drawable/whats_app_icon"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
/>
<TextView
android:layout_marginRight="8dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Report"/>
<Button
android:layout_marginRight="6dp"
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/report"
android:background="#drawable/report_empty" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

Guesses as to what you are doing wrong:
You are using wrap_content. Fresco does not support this unless you also supply a fresco:viewAspectRatio. See the guide to Drawees and the longer explanation about wrap_content.
You are using android:scaleType. This has no effect on SimpleDraweeViews. You need to use fresco:actualImageScaleType. Also be sure that fitXY is really what you want; this does not preserve the aspect ratio. See the documentation on scale types.

Related

How do I add a text background to a button in android?

I've designed buttons as shown in the image above. But I'm unable to add the text background (which is circled) to the button.
How to achieve that?
Here is what I have achieved so far:
<View
android:id="#+id/centerVertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerVertical="true"
android:visibility="invisible" />
<View
android:id="#+id/centerHorizontal"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:visibility="invisible" />
<Button
android:id="#+id/today_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/centerVertical"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/centerHorizontal"
android:layout_marginTop="20px"
android:layout_marginBottom="10px"
android:layout_marginLeft="20px"
android:layout_marginRight="10px"
android:background="#drawable/button1"
android:gravity="center"
android:text="Today"
android:textColor="#FFFFFF" >
</Button>
<Button
android:id="#+id/nextweek_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/centerVertical"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/centerHorizontal"
android:layout_marginTop="20px"
android:layout_marginBottom="10px"
android:layout_marginLeft="10px"
android:layout_marginRight="20px"
android:background="#EF5350"
android:gravity="center"
android:text="Next Week"
android:textColor="#FFFFFF" >
</Button>
<Button
android:id="#+id/later_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_below="#+id/centerVertical"
android:layout_toLeftOf="#+id/centerHorizontal"
android:layout_marginTop="10px"
android:layout_marginBottom="20px"
android:layout_marginLeft="20px"
android:layout_marginRight="10px"
android:background="#66BB6A"
android:gravity="center"
android:text="Later"
android:textColor="#FFFFFF" >
</Button>
<Button
android:id="#+id/range_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/centerVertical"
android:layout_toRightOf="#+id/centerHorizontal"
android:layout_marginTop="10px"
android:layout_marginBottom="20px"
android:layout_marginLeft="10px"
android:layout_marginRight="20px"
android:background="#5C6BC0"
android:gravity="center"
android:text="Range"
android:textColor="#FFFFFF" >
</Button>
XML Layout
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/centerVertical"
android:layout_marginBottom="20px"
android:layout_marginLeft="10px"
android:layout_marginRight="20px"
android:layout_marginTop="10px"
android:layout_toRightOf="#+id/centerHorizontal">
<Button
android:id="#+id/range_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#5C6BC0"
android:gravity="center"
android:text="Range"
android:textColor="#FFFFFF" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#061FAF"
android:drawableRight="#drawable/mail_icon"
android:text="range text"
android:textColor="#FFFFFF" />
</RelativeLayout>
You can do this easily with adding RelativeLayout instead of Button.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"/>
<Button
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:layout_marginRight="20dp"/>
</RelativeLayout>
Just set text to TextView and add source to Button.
You need to do like this.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="250dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:oreantation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
https://stackoverflow.com/a/8823469/5898862
This is best solution for creating customized button using layout. You can easily set background color using android:background property
As per my understanding, what you want is - You need a button background color which is similar/near to image on it.?
In Android Version 5.0, a class is added which help you to extract color from bitmap. Palette
Below is the sample code which you will get the respective background from the image and later you can set it to the button.
Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() {
public void onGenerated(Palette palette) {
// You will get color here
}
});
Possible combination of colors are:
Vibrant
Vibrant Dark
Vibrant Light
Muted
Muted Dark
Muted Light
To use above class add the following dependencies in your project:
dependencies {
...
compile 'com.android.support:palette-v7:21.0.+'
}
======================or=========================
Another way is you can get respective color by image bitmap:
public static int getRespectiveColor(Bitmap bitmap) {
Bitmap newBitmap = Bitmap.createScaledBitmap(bitmap, 1, 1, true);
final int color = newBitmap.getPixel(0, 0);
newBitmap.recycle();
return color;
}
Hope above both will solve your problem. :) cheers!!!

How to set the position of image

i am new in android , i am facing problem in setting the image position . i set image position in layout but when i check on device or emulator it changes position.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/lay_ring"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/backfull_a"
android:orientation="vertical" >
<ImageButton
android:id="#+id/id_ringButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="44dp"
android:layout_marginTop="16dp"
android:background="#android:color/transparent"
android:src="#drawable/button_ring" />
<ImageView
android:id="#+id/image_hand_lastACt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:src="#drawable/white" />
<ImageView
android:id="#+id/id_ring_finger"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="144dp"
android:layout_marginRight="70dp"
android:layout_toLeftOf="#+id/id_ringButton"
android:src="#null" />
<ImageView
android:id="#+id/id_fingA_ring"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/id_imgback"
android:layout_marginRight="21dp"
android:layout_marginTop="48dp"
android:src="#drawable/a_style_a" />
<ImageView
android:id="#+id/id_fingB_ring"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/id_ringButton"
android:layout_marginRight="44dp"
android:layout_toLeftOf="#+id/id_fingA_ring"
android:src="#drawable/a_style_b" />
<ImageButton
android:id="#+id/id_next_ring"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/id_ringButton"
android:layout_alignTop="#+id/id_ring_finger"
android:layout_marginTop="46dp"
android:background="#android:color/transparent"
android:src="#drawable/aero_right" />
</RelativeLayout>
i tried but did not find proper solution . give some demo or link that is easily understandable .
android handset has many DPIs. so,you should not set the position too accurate.
You can use some relative description like toRightof / alignPerentRight etc.

Layout optimisation Android

I have a ListView with the following layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:inevent="http://schemas.android.com/apk/lib/com.estudiotrilha.inevent.view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:paddingBottom="8dp"
android:id="#+id/list_events"
android:addStatesFromChildren="true" >
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="180dp"
android:padding="1dp"
android:background="#drawable/post" >
<ImageView
android:id="#+id/imageEventCover"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/event_cover"
android:scaleType="centerCrop" />
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:visibility="gone"
android:layout_marginTop="25dp" />
<com.estudiotrilha.inevent.view.NewTextView
android:id="#+id/textIsEnrolled"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="ENROLLED"
android:textColor="#color/infoText"
inevent:textFor="small"
android:background="#color/infoBoxRed"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_margin="10dp" />
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/event_mark"
android:layout_marginBottom="12dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingTop="10dp"
android:paddingBottom="10dp" >
<com.estudiotrilha.inevent.view.NewTextView
android:id="#+id/textEventName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Lisbon Challenge"
inevent:textFor="h3"
android:paddingBottom="10dip"/>
<ImageView
android:id="#+id/imageCalendar"
android:layout_below="#+id/textEventName"
android:layout_width="18dp"
android:layout_height="18dp"
android:contentDescription="#string/facebookHolder"
android:src="#drawable/ic_action_go_to_today" />
<com.estudiotrilha.inevent.view.NewTextView
android:id="#+id/textEventDuration"
android:layout_below="#+id/textEventName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/imageCalendar"
android:layout_marginLeft="5dp"
android:textColor="#555"
inevent:textFor="small"
android:text="MAI 05-11, 2014" />
<ImageView
android:layout_below="#+id/textEventName"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_toLeftOf="#+id/textEventPlace"
android:contentDescription="#string/facebookHolder"
android:src="#drawable/ic_action_place" />
<com.estudiotrilha.inevent.view.NewTextView
android:layout_below="#+id/textEventName"
android:id="#+id/textEventPlace"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="5dp"
android:textColor="#555"
inevent:textFor="small"
android:text="Lisbon, Portugal" />
</RelativeLayout>
</RelativeLayout>
<View android:layout_width="fill_parent"
android:layout_marginRight="2dp"
android:layout_marginLeft="2dp"
android:layout_height="3dp"
android:background="#drawable/shadow"/>
</LinearLayout>
In that ListView, will be placed several items with images.
Here is a sample of the real deal:
The problem is that all images are loaded asynchronously.
I am using Universal Image Loader to load those images.
What should I do to optimise the list?
Thanks.
Scrolling fast is known as 'flinging', and it will naturally be quite intensive on a list that loads images dynamically (from web or local store), so the only way to deal with it on a mobile platform is to
a) improve user experience by adding a temporary 'loading image:
DisplayImageOptions options = new DisplayImageOptions.Builder()
.showImageOnLoading(R.drawable.ic_stub) // resource or drawable
.build();
b) Simply do not attempt any process intensive rendering when a fling is occuring. The screen moves too fast for anything useful to be rendered anyway, so you might as well wait until the screen is not moving before attempting to render anything:
boolean pauseOnScroll = false; // or true
boolean pauseOnFling = true; // or false
PauseOnScrollListener listener = new PauseOnScrollListener(imageLoader, pauseOnScroll, pauseOnFling);
listView.setOnScrollListener(listener);

scrollview's child(linear layout)'s background color get changed while scrolling

I was working with scrollview and get the weird problem that I cannot figure out.
I have attached screen shot of graphical view, as I have set one color for the layout background but it get changed while scrolling the view.
Here is my code.
OnCreate of Activity.
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_discussionlist);
ll_comments = (LinearLayout) findViewById(R.id.ll_comments);
for (int i = 0; i < 10; i++) {
View view = LayoutInflater.from(DiscussionListActivity.this)
.inflate(R.layout.comments, null);
ll_comments.addView(view, ll_comments.getChildCount());
Log.print(" ll_comments.getChildCount() ="
+ ll_comments.getChildCount());
}
}
here is activity_discussionlist.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/ll_discussion_content"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/txt_submenu_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="-5dp"
android:background="#drawable/submenu_bg"
android:gravity="center"
android:paddingBottom="10dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingTop="10dp"
android:text="SubMenu"
android:textColor="#FFFFFF" />
<ImageView
android:id="#+id/img_reply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:src="#drawable/ic_reply"
android:visibility="visible" />
</RelativeLayout>
<ScrollView
android:id="#+id/sv_discussion"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:fillViewport="true"
android:scrollbars="none" >
<LinearLayout
android:id="#+id/ll_scroll_main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/rl_discussion"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/discussion_bg"
android:padding="5dp" >
<HorizontalScrollView
android:id="#+id/hl_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginTop="5dp"
android:scrollbars="none" >
<TextView
android:id="#+id/txt_title"
style="#style/TextTitleBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Homework Questions" />
</HorizontalScrollView>
<TextView
android:id="#+id/txt_uploadedby_date"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/hl_title"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:singleLine="true"
android:text="by Ralph on Oct 01,2013 6:15 AM"
android:textColor="#BBBBBB" />
<TextView
android:id="#+id/txt_posts"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_uploadedby_date"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:singleLine="true"
android:text="12 Comments" />
<TextView
android:id="#+id/txt_descr"
style="#style/TextDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_posts"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:singleLine="false"
android:text=" 0 down vote favorite I am setting up images for different devices as per official google docs.As per google docs we should always use dp(density independent pixels) because pixels may varies for different devices. So i have managed images as per dp(density independent pixels). I have put images in drawable xhdpi,hdpi,mdpi and ldpi. it works well for most of devices but for different devices ppi pixels may varies from device to device so dp(density independent pixels) is not fixed so my all calculations according to dp(density independent pixels) goes wrong and cannot be set properly." />
</RelativeLayout>
<View
android:id="#+id/view_separator"
android:layout_width="fill_parent"
android:layout_height="10dp"
android:layout_marginTop="10dp"
android:background="#BBBBBB" />
<LinearLayout
android:id="#+id/ll_comments"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="vertical"
android:padding="10dp" >
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
and here is comments.xml file :
<?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:paddingBottom="20dp" >
<FrameLayout
android:id="#+id/comment_identity"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/comment_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="35dp"
android:background="#ececec"
android:gravity="bottom"
android:orientation="horizontal"
android:weightSum="2" >
<LinearLayout
android:id="#+id/linear_editoption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right|center_vertical"
android:padding="10dp" >
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_edit" />
<TextView
android:id="#+id/text_editoption"
style="#style/TextDescriptionBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="Edit" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear_deleteoption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal|center_vertical"
android:padding="10dp" >
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_delete" />
<TextView
android:id="#+id/text_deleteoption"
style="#style/TextDescriptionBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="Delete" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/rel_commentphoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp" >
<ImageView
android:id="#+id/img_commentpic"
android:layout_width="50dp"
android:layout_height="60dp"
android:background="#drawable/img_bg"
android:src="#drawable/profile" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rel_commentidentity"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/txt_name"
style="#style/TextDescriptionBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="70dp"
android:layout_marginTop="10dp"
android:singleLine="true"
android:text="Ralph Johnson" />
<TextView
android:id="#+id/txt_date"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/txt_name"
android:singleLine="true"
android:text="02 Oct,2013 6:00 AM"
android:textColor="#BBBBBB" />
</RelativeLayout>
</FrameLayout>
<TextView
android:id="#+id/txt_comment"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/comment_identity"
android:layout_marginTop="5dp"
android:singleLine="false"
android:text="This is test comment.Post your comments here." />
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_below="#+id/txt_comment"
android:layout_marginTop="20dp"
android:background="#DDDDDD" />
</RelativeLayout>
As you all can see that I have set the background color only to Linear layout (id of Linear layout is 'comment_options') in comments.xml file.
I have marked red circles in image below. Please see the difference.
The problem isn't with your layout definition or color assignment. Since you are not setting the background property of the base container in activity_discussionlist.xml, the windowBackground property defined for your app-theme is coming into play.
What you are currently seeing is a gradient defined as:
screen_background_selector_light.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#ffe8e8e8"
android:endColor="#ffffffff"
android:angle="270" />
</shape>
So, if your activity's layout was an empty LinearLayout (for example) with no background property set, it would look like this:
Here's where the background might be coming from:
(taken from platforms/android-17/data/res/values/themes.xml)
<style name="Theme.Light">
<item name="windowBackground">#android:drawable/screen_background_selector_light</item>
....
What I think is happening:
lightest background ==>> #ECECEC on mostly #E8E8E8
lighter background ==>> #ECECEC on (#E8E8E8 + a bit of #FFFFFF)
less lighter background ==>> #ECECEC on (#FFFFFF + a bit of #E8E8E8)
dark background ==>> #ECECEC on mostly #FFFFFF
In action:
In the image above, all four LinearLayouts (each above a TextView) are identical, with their background set to "#ECECEC". The visual distinction comes from the activity's background, which is a gradient.
So, if you were set the background property for the parent container (root-level LinearLayout in activity_discussionlist.xml) to say, #ECECEC, or any other color of your liking, this problem would be solved. The gradient is what you don't want.

XML listview overlaps elements when setting visibility

I have an xml layout of about 3000 lines, which serves as the layout for a questionnaire type of app. Each page of the questionnaire is inside of a different linear layout and I set the visibility of the linear layouts in code using View.GONE or View.VISIBLE. This way the user can navigate through the pages without loading new intents each time.
However, when I navigate fast through the app (just pressing the next button to go through the screens), some of the elements that are supposed to be View.GONE shows up and overlaps over the VISIBLE items. This only happens with linear layouts that have list views inside of them. For all the other pages.
I can scroll fast through them, but just the ones with list views in the View.GONE elements sometimes shows up when I navigate too fast. How can I fix this ? Let me know if you want code ... however the xml is very large.
T.I.A.
EDIT
This is a sample of my xml code, I have 3000 lines of this repeating in my xml...
<LinearLayout
android:id="#+id/package_normal_samplesblood"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="70dp"
android:orientation="vertical">
<TextView
android:id="#+id/textview_heading_b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="23sp"
android:layout_marginLeft="13dp"
android:layout_marginRight="10dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:textColor="#6f6f6f"
android:layout_gravity="left"
android:text="Blood Samples"/>
<Button
android:id="#+id/button_samples_blood"
android:text="Add Blood Samples"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:textSize="20sp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
<ListView
android:id="#+id/listview_samples_blood"
android:scrollbarSize="0dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical"
/>
</LinearLayout>
<RelativeLayout
android:orientation="horizontal"
android:background="#ffffff"
android:layout_width="fill_parent"
android:layout_height="75dp"
android:layout_marginTop="-75dp"
>
<View
android:layout_width="fill_parent"
android:layout_alignParentTop="true"
android:layout_height="1dp"
android:background="#DEDEDE"
android:layout_marginTop="2dp"/>
<ImageButton
android:id="#+id/left9"
android:background="#null"
android:scaleType="fitEnd"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/left"/>
<TextView
android:id="#+id/textview_heading2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:textColor="#6f6f6f"
android:layout_gravity="center"
android:text="RhODISĀ®"/>
<ImageButton
android:id="#+id/right9"
android:background="#null"
android:scaleType="fitEnd"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/right"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/package_normal_sampleshair"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="70dp"
android:orientation="vertical">
<TextView
android:id="#+id/textview_heading_b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="23sp"
android:layout_marginLeft="13dp"
android:layout_marginRight="10dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:textColor="#6f6f6f"
android:layout_gravity="left"
android:text="Hair Samples"/>
<Button
android:id="#+id/button_samples_hair"
android:text="Add Hair Samples"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:textSize="20sp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
<ListView
android:id="#+id/listview_samples_hair"
android:scrollbarSize="0dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical"
/>
</LinearLayout>
<RelativeLayout
android:orientation="horizontal"
android:background="#ffffff"
android:layout_width="fill_parent"
android:layout_height="75dp"
android:layout_marginTop="-75dp"
>
<View
android:layout_width="fill_parent"
android:layout_alignParentTop="true"
android:layout_height="1dp"
android:background="#DEDEDE"
android:layout_marginTop="2dp"/>
<ImageButton
android:id="#+id/left10"
android:background="#null"
android:scaleType="fitEnd"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/left"/>
<TextView
android:id="#+id/textview_heading2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:textColor="#6f6f6f"
android:layout_gravity="center"
android:text="RhODISĀ®"/>
<ImageButton
android:id="#+id/right10"
android:background="#null"
android:scaleType="fitEnd"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/right"/>
</RelativeLayout>
</LinearLayout>
And then this is a sample of how I show and hide the linear layouts in code, this repeats for 24 left buttons and 24 right buttons:
left24.setOnClickListener(new View.OnClickListener()
{
public void onClick(View v)
{
package_normal_welcomescreen.setVisibility(View.GONE);
package_normal_package_details.setVisibility(View.GONE);
package_normal_openbag.setVisibility(View.GONE);
package_normal_kitnumber.setVisibility(View.GONE);
package_normal_emptybag.setVisibility(View.GONE);
package_normal_gpscoordinates.setVisibility(View.GONE);
package_normal_image_scene.setVisibility(View.GONE);
package_normal_samplesblood.setVisibility(View.GONE);
package_normal_sampleshair.setVisibility(View.GONE);
package_normal_samplestissue.setVisibility(View.GONE);
package_normal_sampleshorn.setVisibility(View.GONE);
package_normal_samplesother.setVisibility(View.GONE);
package_normal_packsamples.setVisibility(View.GONE);
package_normal_returnbag.setVisibility(View.GONE);
package_normal_sealreturnbag.setVisibility(View.GONE);
package_normal_image_sealedbag.setVisibility(View.GONE);
package_normal_scanned.setVisibility(View.GONE);
package_normal_animal_details.setVisibility(View.GONE);
package_normal_animal_horn_details.setVisibility(View.GONE);
package_normal_animal_ears.setVisibility(View.GONE);
package_normal_area_details.setVisibility(View.GONE);
package_normal_collecter_details.setVisibility(View.GONE);
package_normal_additional_information.setVisibility(View.GONE);
package_normal_owner_details.setVisibility(View.VISIBLE);
package_normal_owner_details.bringToFront();
}
});
right24.setOnClickListener(new View.OnClickListener()
{
public void onClick(View v)
{
if(Session.signatureIsCaptured)
{
package_normal_welcomescreen.setVisibility(View.GONE);
package_normal_package_details.setVisibility(View.GONE);
package_normal_openbag.setVisibility(View.GONE);
package_normal_kitnumber.setVisibility(View.GONE);
package_normal_emptybag.setVisibility(View.GONE);
package_normal_gpscoordinates.setVisibility(View.GONE);
package_normal_image_scene.setVisibility(View.GONE);
package_normal_samplesblood.setVisibility(View.GONE);
package_normal_sampleshair.setVisibility(View.GONE);
package_normal_samplestissue.setVisibility(View.GONE);
package_normal_sampleshorn.setVisibility(View.GONE);
package_normal_samplesother.setVisibility(View.GONE);
package_normal_packsamples.setVisibility(View.GONE);
package_normal_returnbag.setVisibility(View.GONE);
package_normal_sealreturnbag.setVisibility(View.GONE);
package_normal_image_sealedbag.setVisibility(View.GONE);
package_normal_scanned.setVisibility(View.GONE);
package_normal_animal_details.setVisibility(View.GONE);
package_normal_animal_horn_details.setVisibility(View.GONE);
package_normal_animal_ears.setVisibility(View.GONE);
package_normal_area_details.setVisibility(View.GONE);
package_normal_owner_details.setVisibility(View.GONE);
package_normal_collecter_details.setVisibility(View.GONE);
package_normal_additional_information.setVisibility(View.VISIBLE);
package_normal_additional_information.bringToFront();
}
else
{
Toast.makeText(Screen_Package_Normal.this, "Authorized Signature Required", Toast.LENGTH_LONG).show();
}
}
});
I have different types of listviews and adapters, custom and android built in. I don't think the problem lies with the adapter since it works pretty well displaying the listviews and the problem occurs even before the listviews are populated...
I have a temporary fix, not sure how correct this is as an answer, but this fixed my problem... I applied this to my entire layout, and it adds an animation when I hide and show layouts, thus slowing them down a bit, removing the overlapping elements from showing up.
This is what I added to my layout:
android:animateLayoutChanges="true"

Categories

Resources