Overlap views inside Recyclerview - android

Hi I need to implement the layout as attached in pic. I have tried this StackOverFlow answer
but the resultant view get created as attached below
I need that bottom right corner to be above next cell of recyclerview.
Please suggest how can make top of the cell below previous cell.

It looks like you're close. The problems you're seeing here are:
The offset you're using in the item decorator from the example you used isn't large enough - hence the black gaps
The order in which your linear layout manager is stacking your views is from the top, which means that the row below will draw over the cell above.
To fix this, first, add a bit more offset to get rid of the black gaps.
Second, call setReverseLayout(true) on your LinearLayoutManager (can also be done via the constructor) - this will make it draw the bottom items first, so that the cells will draw above the cells below.
Also, you might want to play around with the elevation of the views to get that neat shadow effect, making sure that a row at index N will have a higher elevation than a row at index N+1. You could do this by calling myView.setElevation((getItemCount() - position) * SOME_DP_AMOUNT) when binding each view in your adapter.

Related

How linearly increase and decrease height of Horizontal RecycleView in android

I have Horizontal cyclic ReacycleView. but I want in recycle view's middle item(ImageView) height be greater as compared to other side items.
Recycle view items
That means if any item in the center of RecycleView, it's height should be greater in RecycleView itself.
You can use a different layout for your middle item by implementing getItemViewtype() in your adapter. Similar question and answer here should point you in the right direction.
I created a sample app with this functionality and here is code.
Let me know if you need some explanation.
You need to create A custom layout manager and Item Transformer
CenterLayoutManager
Repository
ScaleTransformer

how do I add widgets before and/or after a list in flutter

I am building an app where I want a message to be displayed at the bottom and top of the List like this example. Ive tried to nest the ListView inside a column, but that is giving me an error. Please Help
Use a column with 3 children. Put an expanded in the middle one and put your ListView in that.
The expanded will take up any room that is not not taken up by the top and bottom children of the column, ensuring that your ListView adapts to whatever you put around it but it always takes up every pixel that you didn't already need for the top and bottom children.

Creating a customized list of custom views

I want to create a list like seen in the picture below and was wondering which one of androids controls would be the best option to do so?
For every row in the list I could use a custom view that has max-Val and current-Val, then draw a rectangle based on that.
But for the list, the headings, and the today indicator: What control should I use here?
RecyclerView is probably the way to go.
Define different view types for
the actual header,
the section headers, and
the list items
Setting it up like that will get you the whole screen except the 'Today' marker.
To add that marker you need to draw on top of the views in the recyclerview. There are 2 options
Just add another view on top of the recyclerview where you draw the text and line, which is possible but not really the cleanest approach, or
use a RecyclerView.ItemDecoration with which you draw the 'Today' text on top of the first item after the header, and decorate (draw over) every subsequent view beneath with the vertical line.

RecyclerView - horizontal, two-row grid, second row offset

I am trying to make a horizontally scrolling grid. It has two rows. The second row is offset (by half the width of one item, but that is trivial to calculate and doesn't matter here).
I am currently using RecyclerView and the GridLayoutManager from https://github.com/antoniolg/RecyclerViewExtensions/tree/master/library/src/main/java/com/antonioleiva/recyclerviewextensions
However, the offsetting is proving extremely difficult.
It should end up looking like
Does anybody have any suggestions for making the second row staggered like in the picture above?
Use StaggeredGridLayoutManager with an ItemDecoration which adds the offset to the item at adapter position 0. You'll get the desired output. (via getItemOffsets).
Alternatively, instead of an ItemDecoration, when onBind is called, you can set the first item's width such that it will include gap on left.
If your data set changes, don't call notifyDataSetChanged which will reset the historical calculations in SGLM. Instead, use detailed notify events like notifyItemRangeInserted so that SGLM will be able to recalculate layout without resetting positions.
I don't know if you're still working on this, but my approach would be to render the items 2 at a time (top/bottom) with the appropriate offset, and then play with your horizontal margins (set them to negative) to create the overlap between item 2 and 3, etc.
You would have to tie OnTouchListeners to the individual items being rendered, not the RecyclerView entries.

Android - keeping a single element contained on screen

I'm experimenting to see if the layout scheme I want to use is possible. I want to have an XML layout that's scrollable. Within that scrollable layout, I want to have a single line going horizontally across the screen (I used just a View with a fixed height and different color). When that horizontal line reaches the top of the screen, and as I scroll down through the layout, I want it to stop and remain at the top of the screen while being able to scroll through everything below it.
I've been messing around in XML trying to get it to work, basically putting a bunch of junk before it and after it.
Any ideas as to how that might work? Would I have to do something fancy with the java code to fix the red line at the top when the scroll position reaches a certain point? Your help would be greatly appreciated.
I am assuming you want something like Gmail app where when you scroll a mail the header sticks on top... To do this, you need 2 views. You have your regular scroller below and overlay a fixed view on top (you can use a relative layout to do this). When your cell goes past a certain spot, you want to populate and set the visibility of the fixed view to VISIBLE. This would give the impression that the view you want to 'stick' to the top really just got stuck rather than scrolled out of view. You'll have to work out the opposite scrolling scenario too based on the location and height of the scrolled cell/view.
HTH

Categories

Resources