Maaan, u saved my graduate work. I make an educational game and could not figure out how to create a table to display data from a database. ChatGPT gave me half working code without explaining how does it work. But your video showed me step by step how to do it on simple example.
Nice tutorial! You missed one thing. You know how your scroll view always show at the center of the viewport? You can change that by moving the pivot point all the way on left. Then your view port starts on the left side.
@@proximacentauri9509 if you are using windows keep the alt key while you select left side on RectTransform panel. If you are using a Mac keep the Cmd key pressed instead
Thanks! This tutorial was great, got me right back into the components I forgot how to use. One thing to add the Content size fitter shouldn't be on the same object as the layout group according to Unity. I fixed it by adding it to the parent (Object with Scroll Rect component)
Does anyone know how to clamp scroll to each object within the "scroll view"? So in your case, It would stop at each character and in order to go to the next character, you would have to scroll again. Sort of like swiping through images on your phone?
i would recommend using the "simple scroll snap" asset (free). i'm currently trying to use it and i am running into issues (mostly to do with my own usage) but it overall seems really helpful
Be my first subscriber ... Are you saying at the end this was your first video? Its just over 14 months later and you've got over 28K subscribers now. Good job !! I personally love the short n sweet videos so I'm going thru all of yours now. Thanks !!
If you can't scroll anything even tho you have an event system, make sure that your contents doesn't have an EventTrigger component. Because for some unknown reason it will catch the pointer events and prevent the parent which has ScrollRect (Who needs pointer events) from catching the events. As a workaround, implement the IPointer interfaces directly instead of through an EventTrigger
every time I see this channel I say in my head: "En Taro Adun" and think the icon isn't right ha ha ha, but not everybody is an StarCraft fan... anyway, Good video, thanks!
if you cant move your list, dont forget to add the Event System... I forgot about that and I was banging my head for ages trying to figure out the problem
Hey! In the part where you were talking about masking, when you add the Mask component, there is an option to untick "Show Mask Graphic" in order to remove the white part, which is the better method to use. Hope this helps!
@@Tarodev Yes... I made it the same quality as your videos 😃 I have one request, if you will, Do you know how to build a Popup which closes on outside click. I'm struggling with it! I tried using OnDeselect, OnPointerEnter, OnPointerExit. And inside OnEnable() { EventSystem.current.SetSelectedGameObject(gameObject); } But, that solution doesn't work for nested Panels. (eg Button on Panel --> (opens another) ---> Button on Panel Can you please recommend a solution/resources for that? Also, my understanding of IPointerClickHandler IPointerDownHandler IPointerEnterHandler IPointerExitHandler IPointerUpHandler is very meagre. If possible please recommend some resources. Looking for your kind help...
I wanted to make a questing system, and since I'm having a lot of quests eventually I would need a vertical one, thought I would have to code it out then I noticed scrollview and that brought me here haha, very easy to follow
Hello, I'm from Brazil and I'm using Google translate to communicate, can you clear up my doubts? I would like to do it using the horizontal scroll bar, but I don't know how to make it active, because every time I play the scene the horizontal bar turns off, I've tried several options but it keeps turning off by itself when I play, do you know what it could be?
hi, great video!! How would you get the list to start over at the end? After the sword, the smiley face is there again without having to scroll in the opposite way
Excellent tutorial! I only have one issue. When I add the "Content Size Fitter" component onto Contents, I lose the ability to scroll. It's like the size Content becomes 0 and I can't scroll past the centre of the the screen.
I ran into this same issue and noticed that he had a horizontal layout component added to the content container. I added it and that resolved my issue. Hope it helps :)
I'm lost right at the start as the item "Content" I have no idea what that is...a empty gameobject? a panel? You refer to it as a container, but I don't know what that is.
If the content size fitter just makes the content holder width turn to 0, Is it because you have use an empty gameobject as the content, just fix them by making the size of the empty gameobject bigger
Hey great tutorial as usual. Could you help out with one thing though I followed along your 3D objects in UI tutorial and then wished to create a scrollable view with those but doing this does not seem to mask the 3D objects
Indeed, it won't work with 3d as scroll view is a canvas specific utility. You'd need to either use a camera with bounds limited to the scroll area, or a Shader which cuts it off
Perfect, thank you! Typical Unity thing that's unintuitive. Anyway, I put the Mask on a direct parent of the "Scroll" object which also worked out fine, so there was no need for the "View" object for my purposes.
I know it's been almost a year but if you're still around: When I follow these steps, I can't see the items on the far left unless I pull them into view with elasticity and then they bounce back out of view. So my steps are to make a new scroll view with the default scrollbars etc. Increase the height of the scroll view > Make the content a vertical layout group > Make 7 child objects with layout element components (I also added a child image to each of these so I can see them) > Set their Rect transform height to 100 > Play. Items at the top of the list dont stay visible.
Figured this out but for anyone hitting the same issue: I had to make sure that my Content's height was much bigger, and went outside the viewport and then the vertical layout group on my Content had padding on the top and bottom (200, -200) that kept things in the right place
The "mask" effect of this does not happen for me when I follow this to the letter. When Unity's default ScrollView is added using the GameObject menu, that maps most of the arrangement discussed in the tutorial, and yet, when settings are adjusted to match what this tutorial says to the letter, the "mask" effect still does not happen. Another thing that never happens no matter how much content is added is the scroll **stopping where the user lets go of it** after the user releases the mouse button. Instead, the scroll view's content bounces right back to wherever it started.
Look into the content size fitter. What's happening is the content is bigger than the actual content rect, so it flings back to where it actually fits into the scroll, even if the content is overflowing
Hello ! :) I joined your Patreon :) and I become Tarobro! but it doesn't have image that this tutorial show~ , any way that I can get it to follow your tutorial?
I have a problem, my scroll rect onty scrolls if I touch outside my buttons, and if I try to scroll putting my finger on a button it selects it, how can I fix it?
Can i figure out somehow is object in scroll viewport (visible) or not? I found a Unity component "ScrollView" that has a "visible" property but I can't figure out how to access "ScrollView", only I can find is a "ScrollRect"
Is there a way to scroll a step-by-step? like .. I created something by putting arrows to the left and right, and scrolling my panel by Image width on click, this way it jumps one picture/image on a time. Is there an easy/simple way to do it with the default scrollbar the way you've shown us? Great video BTW :)
Im surprised by how nobody asked about how you copy+pasted the images and they stuck one after other? 4:49 Doesn't work for me. Okay I found it. By Layout Group. Thanks
Scrollview actually took my 2 days and i still haven't figured out the solution. Elastic component automatically returns to original position after dragging. Such a nasty component...
Losing my fucking mind whenever i try to move my scrollable container itj ust snaps back into place im sure ill figure it out once i've had some sleep but christ on earth
Basically it's due to how my UI components were structured, make them and set them up to be centred right before making them a child of another UI component.
Great! No intros, no begging for likes, just straight to the point. Exactly what I was looking for. Thank you.
Great tutorial as always :D 04:29 was highly needed more my solo project :) thanks!
I've watched a half dozen videos and your is, by far, the best explained (and up-to-date, compared to Brackey's!) Thank you!
For the ones who are new in Unity, if you want to group these 9 objects under "component", select all objects then press ctrl+shift+G
Maaan, u saved my graduate work. I make an educational game and could not figure out how to create a table to display data from a database. ChatGPT gave me half working code without explaining how does it work. But your video showed me step by step how to do it on simple example.
disable show mask graphics in the mask component, it will hide the mask image so you will never need to reduce the alpha to 1.
Oh wow... Thank you
Nice tutorial! You missed one thing. You know how your scroll view always show at the center of the viewport? You can change that by moving the pivot point all the way on left. Then your view port starts on the left side.
Mate i tried your method but it doesn't work to show the images in the center of the view port, do you have a tutorial for that please ?
@@proximacentauri9509 if you are using windows keep the alt key while you select left side on RectTransform panel. If you are using a Mac keep the Cmd key pressed instead
@@klajdimyftari4691 Thank's mate!
Holy shit you are a god thank you
Thanks alot
I had been struggling with this for quite a bit, and your tutorial helped me immensely. Thanks a bunch! :D
Thanks! This tutorial was great, got me right back into the components I forgot how to use. One thing to add the Content size fitter shouldn't be on the same object as the layout group according to Unity. I fixed it by adding it to the parent (Object with Scroll Rect component)
this makes my shop look much better thank you
I always end up finding the solution to almost anything on this channel, bravo taro 👍
Does anyone know how to clamp scroll to each object within the "scroll view"? So in your case, It would stop at each character and in order to go to the next character, you would have to scroll again. Sort of like swiping through images on your phone?
i would recommend using the "simple scroll snap" asset (free). i'm currently trying to use it and i am running into issues (mostly to do with my own usage) but it overall seems really helpful
The best tutorial on ScrollRects ive seen
This was my VERY first tutorial 😊
super cool stuff to learn on the weekend lol, will watch the entire playlist.
at 2:27 the easyest way to make the viewport transparent is to just untick "Show Mask Graphic" in the "Mask" window
I always come back here when I set up a scroll rect :D
Sometimes the brain just cannot retain certain information 😂
Great tutorial, directly to the point. Thank you very much!
Great video, clear explanation directly to the point thanks
Be my first subscriber ... Are you saying at the end this was your first video? Its just over 14 months later and you've got over 28K subscribers now. Good job !! I personally love the short n sweet videos so I'm going thru all of yours now. Thanks !!
Yessss, I had zero subs at this stage and was excitedly waiting for my first 😊
Thanks for enjoying my content!
Very concise, clear and helpful. Thank you so much
If you can't scroll anything even tho you have an event system, make sure that your contents doesn't have an EventTrigger component. Because for some unknown reason it will catch the pointer events and prevent the parent which has ScrollRect (Who needs pointer events) from catching the events. As a workaround, implement the IPointer interfaces directly instead of through an EventTrigger
This some top notch tutorial, nice and short, thank you!
every time I see this channel I say in my head: "En Taro Adun" and think the icon isn't right ha ha ha, but not everybody is an StarCraft fan... anyway, Good video, thanks!
Great tutorial, thank you, Tarodev!
:D
Instant sub, this is great! Thank you! 👏👏👏
if you cant move your list, dont forget to add the Event System... I forgot about that and I was banging my head for ages trying to figure out the problem
OMG!! Thank YOU!!! I was having the exact problem!!
Hey! In the part where you were talking about masking, when you add the Mask component, there is an option to untick "Show Mask Graphic" in order to remove the white part, which is the better method to use. Hope this helps!
Perfect video as always. One thing I would love to see is how to scroll using gamepad/keyboard etc?
Show mask graphic on the Mask component avoids having to change the alpha
Thank you!
I just started to watch your tutorials.
It's pretty helpful. Thanks. 괜찮은 튜토리얼 같아요~~ 땡큐~ ㅎㅎㅎㅎㅎ
you just had the right answer all the time, thank you S2
Thanks, super helpful! Came here to brush up on this component before implementing a new quest journal UI. I'm ready now.
Hey, Take This!⭐
Great Tutorial!
Ohhh, a gold star 😊
@@Tarodev Yes... I made it the same quality as your videos 😃
I have one request, if you will, Do you know how to build a Popup which closes on outside click.
I'm struggling with it!
I tried using OnDeselect, OnPointerEnter, OnPointerExit.
And inside OnEnable()
{
EventSystem.current.SetSelectedGameObject(gameObject);
}
But, that solution doesn't work for nested Panels. (eg Button on Panel --> (opens another) ---> Button on Panel
Can you please recommend a solution/resources for that?
Also, my understanding of IPointerClickHandler IPointerDownHandler IPointerEnterHandler IPointerExitHandler IPointerUpHandler is very meagre. If possible please recommend some resources.
Looking for your kind help...
Would you be able to create a carousel effect for the UI so it's constantly looping when you scroll?
You saved my life for the second time ! Great job
Great. This is best tutorial for scroll in untiy.
I wanted to make a questing system, and since I'm having a lot of quests eventually I would need a vertical one, thought I would have to code it out then I noticed scrollview and that brought me here haha, very easy to follow
Hello, I'm from Brazil and I'm using Google translate to communicate, can you clear up my doubts? I would like to do it using the horizontal scroll bar, but I don't know how to make it active, because every time I play the scene the horizontal bar turns off, I've tried several options but it keeps turning off by itself when I play, do you know what it could be?
Great tutorial ! You have a new sub
Thank you for the tutorial I just needed that!! :)
Excellent tutorial, thanks a lot!
hi, great video!! How would you get the list to start over at the end? After the sword, the smiley face is there again without having to scroll in the opposite way
Excellent tutorial!
I only have one issue. When I add the "Content Size Fitter" component onto Contents, I lose the ability to scroll. It's like the size Content becomes 0 and I can't scroll past the centre of the the screen.
I ran into this same issue and noticed that he had a horizontal layout component added to the content container. I added it and that resolved my issue. Hope it helps :)
@@IcieJuicy Im having this same issue, Which object has the "horizontal layout component"? The Panel, the View or the Contents?
@@Duros360 the Content
@@IcieJuicy thank you so much for this comment, you just saved me, lol
Thanky you!
I'm lost right at the start as the item "Content" I have no idea what that is...a empty gameobject? a panel? You refer to it as a container, but I don't know what that is.
Content is a gameobject with rect transform, Horizontal layout group, content size filter
Ty for the tutorial, you explain my problem with the content size and give a direct answer (ContentSizeFitter) and why, ty
Thank you for this tutorial!
Thanks Tarodev, very cool
Absolutely come in clutch thanx😂
This was a really helpful tutorial!
Thank you so much ! No code is always cool 😊
thanks for the great tutorial!
You are great. Thank you for tutorial !
Great Video! Thank you
Thanks for the help!
thanks a lot for sharing, you are amazing!
If the content size fitter just makes the content holder width turn to 0, Is it because you have use an empty gameobject as the content, just fix them by making the size of the empty gameobject bigger
Thank you so much. You sooooo good!!!
Perrrrfect tutorial. Thanks!
Hey great tutorial as usual. Could you help out with one thing though I followed along your 3D objects in UI tutorial and then wished to create a scrollable view with those but doing this does not seem to mask the 3D objects
Indeed, it won't work with 3d as scroll view is a canvas specific utility. You'd need to either use a camera with bounds limited to the scroll area, or a Shader which cuts it off
Perfect, thank you!
Typical Unity thing that's unintuitive. Anyway, I put the Mask on a direct parent of the "Scroll" object which also worked out fine, so there was no need for the "View" object for my purposes.
Thank You...
Thanks for this tutorial
I know it's been almost a year but if you're still around: When I follow these steps, I can't see the items on the far left unless I pull them into view with elasticity and then they bounce back out of view. So my steps are to make a new scroll view with the default scrollbars etc. Increase the height of the scroll view > Make the content a vertical layout group > Make 7 child objects with layout element components (I also added a child image to each of these so I can see them) > Set their Rect transform height to 100 > Play. Items at the top of the list dont stay visible.
Figured this out but for anyone hitting the same issue: I had to make sure that my Content's height was much bigger, and went outside the viewport and then the vertical layout group on my Content had padding on the top and bottom (200, -200) that kept things in the right place
@@adhocdropoffs You could also check out "content size fitter" to dynamically resize it to fit the content.
I came looking for copper and I found gold. Thank you so much!!! Also is that possible to use mouse scroll for scrolling but not mouse drag?
Lets say i only have one item, how can i make it stick to the left or right, instead of the center(Building a dynamic inventory system)
You could create a wrapper object around your item. The wrapper can be full width and the item can be left aligned within
The "mask" effect of this does not happen for me when I follow this to the letter. When Unity's default ScrollView is added using the GameObject menu, that maps most of the arrangement discussed in the tutorial, and yet, when settings are adjusted to match what this tutorial says to the letter, the "mask" effect still does not happen. Another thing that never happens no matter how much content is added is the scroll **stopping where the user lets go of it** after the user releases the mouse button. Instead, the scroll view's content bounces right back to wherever it started.
Look into the content size fitter. What's happening is the content is bigger than the actual content rect, so it flings back to where it actually fits into the scroll, even if the content is overflowing
when i do this all of the objects snap back to position after i move them
Hello ! :) I joined your Patreon :) and I become Tarobro!
but it doesn't have image that this tutorial show~ , any way that I can get it to follow your tutorial?
This video was looooong before my patreon, but message me on patreon and we can work something out!
@@Tarodev Ok I just sent you message on Patreon :)
Thank you!
I have a problem, my scroll rect onty scrolls if I touch outside my buttons, and if I try to scroll putting my finger on a button it selects it, how can I fix it?
Thanks very helpful
how is your unity editor start fast when you press Play ??!
Enjoy: ruclips.net/video/P7cYVg5fAvY/видео.html
@@Tarodev You are life saver thanks !
How can i achive this result, without UI items
Particles are not visible inside the scroll view, even the visible inside mask is enabled in renderer
Can i figure out somehow is object in scroll viewport (visible) or not?
I found a Unity component "ScrollView" that has a "visible" property but I can't figure out how to access "ScrollView", only I can find is a "ScrollRect"
Is there a way to scroll a step-by-step? like .. I created something by putting arrows to the left and right, and scrolling my panel by Image width on click, this way it jumps one picture/image on a time.
Is there an easy/simple way to do it with the default scrollbar the way you've shown us?
Great video BTW :)
Im surprised by how nobody asked about how you copy+pasted the images and they stuck one after other? 4:49 Doesn't work for me.
Okay I found it. By Layout Group. Thanks
thank you
This wont work for me for some reason, I have followed multiple tutorials and even used the built in object but nothing will scroll
Thenks bro ❤
Thanks!!!!!
amazign tut
Thanks a lot !
thanks a lot !
Scrollview actually took my 2 days and i still haven't figured out the solution.
Elastic component automatically returns to original position after dragging.
Such a nasty component...
Thanks
Brilliant
thank you good
Life Saver
ty
hmmm, it's not working g:(
Very first subscriber..... Hmm.
Losing my fucking mind whenever i try to move my scrollable container itj ust snaps back into place im sure ill figure it out once i've had some sleep but christ on earth
Basically it's due to how my UI components were structured, make them and set them up to be centred right before making them a child of another UI component.
AND ITS NOT A FUCKING PANEL ITS A FUCKING IMAGE ARGHHHHHHHHHHHHHHHHHHHHH
thanks love u
Bastante util
nice
🎉🎉🎉
goood
Thanks!
Thank you!