Hello everyone, I’m trying to create a (2D) scrollable component that must contain other components, in essence a ListView (like that of Android). I created the various gesture necessary for the scrolling event but I do not know how to do the animation for scrolling and displaying objects. I’m looking at examples for 2 days, but I can not understand well, is there any tutorial I can start with? Or someone who can help me starting from the basics? I’m new with monogame and many things are not well documented
There’s no builtin way to do this.
You could use an UI-Library or code it yourself.
If you wanna code it yourself you basically have to render anything inside the scrollbox on to texture and then draw that texture (cropped depending on scroll) inside of the scrollbox.
mmmm… inside the scrollbox i have two or more object instance (like drawable game component). Like to Android ListView i’ll try to implement an adapter to get the item by position. is the correct way or need other better implementations? But…the problem is: how to “crop” texture item inside scrollbox?
There’s multiple ways to do it.
You could probably use a viewport.
Or a scissor test
Alternately, use Rectangle.Intersect on the scrollview’s display area and the item’s intended render destination. Use the result as your source rectangle to get a “clipped” image.
I implemented my own system of forms, the hierarchy has as parent the class component, which has two children, simple components and compound components, the composite components have a list of components.
For the scrollable component use an area, which is a compound component that is only used as a container. I use a RenderTarget2D with the size of what I’m going to show and what I do is draw the area component (with its internal components, which are going to move), so you change the position of the area component and the RenderTarget2D only draws the falling part in your sight.
1 Like
The cropping is as easy. You can pass a source-rect to SpriteBatch.Draw. You’ll just have to figure out the calculation of the rectangle you need.
Sup @gabry90 were you able to get this fully functional in the end, Im at a point where i need to implement something similar.
Effectively my scrollable area will be a list of cards where each one can only be dragged vertically towards a target area in the middle of the screen. I only want to display x number of cards but have the entire card list accessible by way of a horizontal scroll - would the suggestions you guys made also be relevant me or do i need to do something else @Benjamin_W, @Myth, @Finnhax?
Any feedback is welcome from anyone else reading this - thanks