Android - RecyclerView with one layout, multiple setVisibility - java

I have a basically all in one layout which has everything needed for my app's main feed. All variable items (images, video thumbnails.. Etc.) are set to GONE at first and set to VISIBLE when it is needed.
The problem is sometimes, might be due to RecyclerView's recycling behavior, the item which is supposedto be GONE is VISIBLE in the wrong places.
Example :
Item no 1 contains Text
Item no 2 contains Image
Item no 3 contains Image
I keep scrolling down to item no x, then scroll back up and here's what I get :
Item no 1 contains Image from item no x, sometimes item no 3
Item no 2 contains Image
Item no 3 contains Image
I'm using a custom ViewHolder which extends RecyclerView.ViewHolder.
The purpose of the CustomViewHolder is for layout declaration and initialization.
ProgressBar progressBar;
View viewDimmer;
RelativeLayout postListWrapper;
...
public ObjectViewHolder(View v) {
super(v);
progressBar = (ProgressBar)v.findViewById(R.id.post_inscroll_progressBar);
viewDimmer = (View)v.findViewById(R.id.post_inscroll_viewDimmer);
postListWrapper = (RelativeLayout)v.findViewById(R.id.post_inscroll_postListWrapper);
}
An example of how I load the image :
Picasso.with(context)
.load(youtubeThumbnailUrl)
.fit()
.centerCrop()
.into(
((ObjectViewHolder) holder).userPostYoutubeImage
);
I've set each visibility to GONE if no url is obtained from the server
((ObjectViewHolder) holder).userPostImageWrapper.setVisibility(View.GONE);
((ObjectViewHolder) holder).userPostYoutubeImageWrapper.setVisibility(View.GONE);
But somehow the image is still reused on the previous items (yes, not only Item no 1). Sometimes image are also in the wrong ImageView. Image D is supposed to be in ImageView D, but it's in ImageView A instead.
Any guide for setting RecyclerView up and going nicely?
If I miss anything, or need to supply more code, please do inform me :D

You need to put the else condition too. Like the example below.
// if no url is found from server
if(url == null){
((ObjectViewHolder) holder).userPostImageWrapper.setVisibility(View.GONE);
((ObjectViewHolder) holder).userPostYoutubeImageWrapper.setVisibility(View.GONE);
} else {
// Some url has found
((ObjectViewHolder) holder).userPostImageWrapper.setVisibility(View.VISIBLE);
((ObjectViewHolder) holder).userPostYoutubeImageWrapper.setVisibility(View.VISIBLE);
}
Do this for each of the items you've got there as the list item in case of you're setting their visibilities in runtime.

All your if conditions in onBindViewHolder() must have an else block too.
Don't leave any if condition without else. You can provide a default behaviour in the else block when if condition becomes false.

Related

Snapping RecyclerView for scrolling one item at a time, using FocusLayoutManager

I am using FocusLayoutManager for RecyclerView. Everything is fine but I need to swipe only one item at a time. I have also tried LinearSnapHelper and others too, i.e. SnapHelperOneByOne but didn't helped. Also tried to modify the focus layout manager class itself but all in vain. Any help would be appreciated.
Link for FocusLayoutManager
Link for SnapHelperOneByOne
Link for FocusLayoutManagerLibrary
Note: I have tried to attach the SnapHelper to RecyclerView after layout manager is assigned.
val focusLayoutManager = FocusLayoutManager.Builder()
.focusOrientation(FocusLayoutManager.FOCUS_TOP)
.isAutoSelect(true)
.maxLayerCount(1)
.setOnFocusChangeListener { focusdPosition, lastFocusdPosition -> }
.build()
myRecycler.layoutManager = focusLayoutManager
Using Snap Helper doesn't help also and makes the scrolling lagging (jerks)
val mySnapHelper = SnapHelperOneByOne()
mySnapHelper.attachToRecyclerView(myRecycler)
Got stuck with the same issue. Set the focus change listener code like below. (Found one work around for Java)
.setOnFocusChangeListener((focusdPosition, lastFocusedPosition) -> {
if (focusdPosition == lastFocusedPosition - 1 || focusdPosition == lastFocusedPosition + 1) {
myRecycler.stopScroll();
}
})
This code will stop the scroll for the RecyclerView, if the current focused item is after or before the previous focused item then it will stop the scroll.
Remove the SnapHelper because it creates a scroll animation lag with FocusLayoutManager.

Espresso perform click on view in Recyclerview item

I tried everything to perform click on view in recyclerview item but not succesfull. Read every option on internet and tried it but still not working. Lately I used:
onView(ViewMatchers.withId(R.id.live_rw_liveMatchList))
.perform(RecyclerViewActions.actionOnItemAtPosition(2, MyViewAction.clickChildViewWithId(R.id.pick_pw_pickLeft)));
But all i get is:
android.support.test.espresso.AmbiguousViewMatcherException: 'with id:
hr.psk.android:id/ticket_list_list' matches multiple views in the
hierarchy. Problem views are marked with '****MATCHES****' below.
And it matches only one view (my recyclerview with 13 childs)
I know this should work but it is not working in my project. Tried to perform only click on recyclerviw item in other recyclerview to make it more simple like this:
onView(withId(R.id.ticket_list_list))
.perform(RecyclerViewActions.actionOnItemAtPosition(0, click()));
But it gives me the same message back -> Multiple matches problem
somebody help, I really tried everything
onView(withId(R.id.ticket_list_list))
.perform(RecyclerViewActions.actionOnItemAtPosition(0, click()));
The error you're getting means that there's another View somewhere that also uses the id ticket_list_list
Is ticket_list_list your actual list view? (the parent of the things that you want to click)
If it is then is it the only one available on the screen? if it is then use the following
onView(allOf(withId(R.id.ticket_list_list), isDisplayed()))
.perform(RecyclerViewActions.actionOnItemAtPosition(0, click()));
Adding the isDisplayed() Matcher makes the targeted View more specific by targeting only those that are displayed and ignoring those that are existing but not displayed
If there really is another matcher displayed (or the above doesn't work for you) that has the same id as the one you're trying to match then use the following
onView(allOf(withId(R.id.ticket_list_list), withParentIndex(index_of_matcher_here)))
.perform(RecyclerViewActions.actionOnItemAtPosition(0, click()));
Instead of isDisplayed() withParentIndex(some_number) should more specifically target and give you the view that has the id you're looking for along with the index of it
In the very messy instance that the above still doesn't work, maybe because all the returned Views have the same index possibly because they are the children of another View then you can get creative and do something like
onView(allOf(withId(R.id.ticket_list_list), withParent(allOf(withId(if_of_the_parent), withParentIndex(index_of_matcher_here)))))
.perform(RecyclerViewActions.actionOnItemAtPosition(0, click()));
to specify the index of the parent instead.
Just mix 'n match your way through it, just make sure to not go crazy on the Matchers and just keep things readable
Use as little as you can (make sure it's readable and maintainable too and not just made up of indexes), you're not trying to get the coordinates for a missile target- you just want the View
I also face the same problem before few days but finally got the solutions from StackOverflow.
If you want to click recycler custom item view click then implement the following code in your project
You need to write this code in java this will help you a lot and saved your time
ClickOnButtonView is control a view action happened in the list item and
UiController class helps you find custom row item
The code is written in Kotlin
#RunWith(AndroidJUnit4::class)
class CampaignFragmentTest {
#get: Rule
val activityTestRule = ActivityTestRule(TestActivity::class.java)
#Test
fun testCustomListClick() {
clickOnButtonAtRow(0)
}
}
private fun clickOnButtonAtRow(position: Int) {
Espresso.onView(ViewMatchers.withId(R.id.list)).perform(RecyclerViewActions.actionOnItemAtPosition<RecyclerView.ViewHolder>
(position, ClickOnButtonView()))
}
inner class ClickOnButtonView : ViewAction {
internal var click = ViewActions.click()
override fun getConstraints(): Matcher<View> {
return click.constraints
}
override fun getDescription(): String {
return " click on custom button view"
}
override fun perform(uiController: UiController, view: View) {
//btnClickMe -> Custom row item view button
click.perform(uiController, view.findViewById(R.id.btnClickMe))
}
}
That error means that it found multiple views with the id R.id.ticket_list_list. There should also be a view hierarchy log that follows the error message you provided, showing the views that Espresso found with that same id marked with ****MATCHES****.
So you can either change the id of the view you want to test or target the view by providing another ViewMatcher as below:
onView(allOf(withId(recyclerViewID), viewMatcher))
.perform(RecyclerViewActions.actionOnItemAtPosition(0, click()));
You Can also create your own custom click action like this :
fun customActionClickOnItemEvent(
#NonNull targetViewId: Int
): ViewAction {
return object : ViewAction {
val click = ViewActions.click()
override fun getDescription(): String = "Item clicked"
override fun getConstraints(): Matcher<View> = click.constraints
override fun perform(uiController: UiController?, view: View?) {
click.perform(uiController,view?.findViewById(targetViewId))
}
}
}
And Calling this function like this :
onView(withId(R.id.rv_products)).perform(
RecyclerViewActions.actionOnItemAtPosition<RecyclerView.ViewHolder>(
1,
customActionClickOnItemEvent(R.id.img_wish_list)
)
)

Start an activity with a shared element from custom view

I want to create a animation between two Activities with a image as shared element, see Customize Activity Transitions
My problem: In the source activity the image is drawn on a canvas of a custom view :-(
Is there a way to use this image as a shared element or do I have to add a real ImageView?
You can't share the image only, but you can share the entire custom view. This means that the entire custom View would disappear from the calling Activity when the shared element is transferred to the launched Activity. If your custom View only has the image, that would be fine, but if it paints other things, that would be disastrous.
If you want to share only the image, you'll have to create a View (e.g. ImageView) and move the image to it and then share it. That way, when the shared element is transferred, it hides properly from the calling activity.
The shared elements don't actually move Views between Activities, they just share a 'snapshot' of the view as a bitmap and the position of the view. In the launched activity, the view with the given transition name will be laid out in that position. You can use the snapshot or not, depending on your needs. By default, the snapshot is not used.
So you'll need some code like this:
public void launchActivity(final Intent intent, final CustomView view) {
final Bitmap bitmap = view.getSharedImage();
ImageView imageView = new ImageView(view.getContext());
imageView.setBitmap(bitmap);
LayoutParams layoutParams = view.createSharedImageLayoutParams();
final ViewGroup parent = (ViewGroup)view.getParent();
parent.addView(imageView, layoutParams);
parent.getViewTreeObserver().addOnPreDrawListener(new OnPreDrawListener() {
#Override
public boolean onPreDraw() {
parent.getViewTreeObserver().removeOnPreDrawListener(this);
customView.hideSharedImage();
ActivityOptions activityOptions = ActivityOptions.
makeSceneTransitionAnimation(this, imageView, "destName");
startActivity(intent, activityOptions.toBundle();
}
});
setExitSharedElementCallback(new SharedElementCallback() {
#Override
public void onSharedElementsArrived(List<String> sharedElementNames,
List<View> sharedElements, OnSharedElementsReadyListener listener) {
super.onSharedElementsArrived(sharedElementNames, sharedElements,
listener);
parent.removeView(imageView);
customView.showSharedImage();
}
});
}
I haven't specifically tried the above, but that's the essence of it. If you don't want to use the newer onSharedElementsArrived, you can create a custom ImageView that listens for onVisibilityChanged. If you have an exit transition, you can also listen for the end of it as well. You just need some trigger that will tell you to reset the state so that the ImageView is removed and your custom View should draw the image again.
In the example above, I placed the ImageView in the same parent as the custom View. You may get more flexibility by putting it into the DecorView, but you'll have to figure out what the global position is and it will also overlay everything on the screen. Alternatively, since I added the ImageView to the parent, that won't work for all parents (e.g. ListView, LinearLayout). You know your View hierarchy and you'll have to choose the best place to put it.
Or, you could change your custom View to be a custom ViewGroup and contain the sharable image as an ImageView! Sounds easier to me.

custom rows in ListView

i have the following problem, I am writing an app that repeats the http://www.rottentomatoes.com/mobile/ website, if you look on the site there are deviders the "Opening this Week", "Top Box Office" and "Also in Theaters" so my question is, how do i add this custom rows to the ListView that holds all the movies
here is what i have so far, please pitch me some ideas so it will look exactly like on the site
The easiest way to achieve this would be to include the dividers in the layout of item views. Then make them VISIBLE only when the view maps to the first item of a new category, otherwise leave them as GONE.
Example (in semi-pseudocode):
First, make your item layout like this:
<LinearLayout orientation=vertical>
<TextView id=divider>
<your original item layout>
</LinearLayhout>
Then, in the adapter's getView():
Film item = getItem(position);
boolean needsDivider = (position == 0 || getItem(position - 1).filmCategory != film.filmCategory);
if (needsDivider)
{
dividerView.setVisibility(View.VISIBLE);
dividerView.setText(getFilmCategoryName(film.filmCategory));
}
else
dividerView.setVisibility(View.GONE);
A more fancy solution would be to use a library like StickyListHeaders. It doesn't work as your mobile site example, but it's probably even better (e.g. the headers don't scroll up out of the screen).

Fast Scroll In ListView optimizing using UniversalImageloader or using references of Views

I am trying to make a TimeLine somewhat similar to Facebook or Instagram. More closer to Instagram. In Images loading i am using library UniversalImageLoader. Each of my ListView item row is probably more than 600dp in height. Usually I am fetching 5 items at a time.
The problem that occurs now is, The images when scroll a little fast replace each other. Since the views are being reused. It takes about 3-4 seconds for images to show up otherwise wrong images will be displayed in listView Row.
1- If anyone can know how to optimise/fix this fast scroll ImageOverlap issue
Otherwise,
2- What is the way to record EntireView , let's say in some "ArrayList" and placing it at current position. Noting that there are quite other stuff happening too , not only mediaDp being changed.
if (convertView == null)
{
view = inflator.inflate(R.layout.timeline_list_row, parent, false);
viewHolder.userDp = (RoundedImageView) view.findViewById(R.id.userDp);
viewHolder.mediaDp = (ImageView) view.findViewById(R.id.imagePostedMedia);
/************ Set holder with LayoutInflater ************/
view.setTag(viewHolder);
final ViewHolder newHolder = viewHolder;
}
else
viewHolder = (ViewHolder) view.getTag();
imageLoader.displayImage(media.imagePath, viewHolder.mediaDp);
Try setting bitmap options for the imageview as follows.
DisplayImageOptions options = new DisplayImageOptions.Builder()
.showImageOnLoading(R.drawable.ic_stub)
.showImageForEmptyUri(R.drawable.ic_empty)
.showImageOnFail(R.drawable.ic_error)
.cacheInMemory(true)
.cacheOnDisc(true)
.considerExifParams(true)
.build();
and now try diplay to imageview as
imageLoader.displayImage(imageUrls[position], holder.image, options);
I am sure this will work.
See the code cacheInMemory(true) property for display options is important.
I have answered a similar question (like this) before, please take a reference to this Answer :
How can I delay the loading of views in my list adapter while the user is scrolling fast
I hope this helps.

Categories