Search Unity

  1. Unity 2020.1 has been released.
    Dismiss Notice
  2. Good news ✨ We have more Unite Now videos available for you to watch on-demand! Come check them out and ask our experts any questions!
    Dismiss Notice

[Released] PagedRect: Paging Solution for Unity UI

Discussion in 'Assets and Asset Store' started by DaceZA, Feb 3, 2016.

  1. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    I like the idea. I'll see what I can do.
     
  2. rrahim

    rrahim

    Joined:
    Nov 30, 2015
    Posts:
    184
    Awesome, thanks. :)
     
  3. MrMatthias

    MrMatthias

    Joined:
    Sep 18, 2012
    Posts:
    179
    There is a bug that keeps changing the scene, messing with version control. The scene will always be marked dirty
     
  4. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    Unfortunately, that is a known issue. PagedRect executes various steps to ensure that it is always up to date and correct according to its parameters, which Unity picks up as changes to the scene. Without these steps, page positions, pagination buttons, etc. may not be correct. It ultimately came down to a choice between marking the scene as dirty, or having PagedRect not function correctly.
     
  5. jk15

    jk15

    Joined:
    Jun 23, 2011
    Posts:
    49
    Hi @DaceZA, I've purchased your asset and I'm playing with it now.

    Is it possible to have parts of the next and previous pages viewable? Kind of hinting at what is on either side or can only one page be seen at a time? I had a look through the settings and could not find a way to do this.

    Thanks.
     
  6. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    It sounds like the closest match to what you're describing is PagedRect's 'Page Previews' functionality ("Horizontal Previews" and "Vertical Previews" in the demo) - you can find the functionality to enable this listed in the documentation (http://www.digital-legacy.co.za/PagedRect/Documentation#ThePagedRectComponent-PagePreviews).

    Unfortunately, that is the only default functionality which will allow you to see parts of other pages - however, you can experiment with adjusting the size of the 'Sizing Panel' (PagedRect -> Viewport -> Sizing Panel). This panel is used by PagedRect to size its pages - if it is smaller than the Viewport (for example, by specifying a left/right offset), then you will be able to see some of the next page (only the next page, however, as the pages are left-aligned).

    Hope this helps!
     
  7. MartinGiaco

    MartinGiaco

    Joined:
    Jul 24, 2013
    Posts:
    11
    DisableScrollWheel does nothing.
    I guess PagedRect_ScrollRect's OnScroll method should look like this ;)

    Code (CSharp):
    1.  
    2. public override void OnScroll(PointerEventData data)
    3. {
    4.       if(DisableScrollWheel) return;
    5.       base.OnScroll(data);
    6. }
     
  8. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi Martin,

    The 'DisableScrollWheel' (on PagedRect_ScrollRect) property isn't actually used by PagedRect anymore - sorry, it's a legacy property and should be removed. I'll see to it that it is removed for future versions of PagedRect, or adjusted as per your suggestion.

    The property which actually controls this behaviour is located on the PagedRect object itself, and is called 'UseScrollWheelInput' - I've just tested this and it does appear to be working as expected.

    If you'd prefer, you are welcome to make the modification you suggested and use it like that if that works best for you :)

    Thanks for pointing this out!
     
  9. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    Hi there,

    I'm having difficulty triggering NextPage() etc. from other buttons outside the pagination system.
    Is there something i'm missing? do i need to use the next/prev buttons provided?
    Where can I find tutorials/examples of different ways this asset can be used?

    Thanks!
     
  10. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    What kind of difficult are you experiencing? NextPage() /etc. should function the same regardless of where they are called from (the built-in Next/Previous buttons just call these methods). Do you get an error message?

    This is a simple example of how to call methods on a PagedRect:

    Code (CSharp):
    1. using UnityEngine;
    2. using UI.Pagination;
    3.  
    4. class MyMonoBehaviour : MonoBehaviour
    5. {
    6.      public PagedRect pagedRect;
    7.  
    8.      void Start()
    9.      {
    10.           // you can populate the pagedRect variable in the inspector,
    11.           // or you could try something like this:
    12.           pagedRect = GameObject.FindObjectOfType<PagedRect>();
    13.  
    14.           // call a method on the PagedRect
    15.           pagedRect.NextPage();
    16.      }
    17. }
     
  11. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    There's something weird going on. I get no errors, but the paged rect doesn't even work with the built-in nav buttons IF i change the pages with my own content(they have the page script on, i created the pages based on the default template). with the default stuff all works, the moment i replace the pages, it no longer works.
    ah yeah, SetCurrentPage() only works once.
    i'm using unity 2017.3 i think, i also have other pagedrect in the scene(that works)
     
  12. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Have you tried clicking the 'Update Pagination' button in the inspector? It shouldn't be necessary, but it may help.

    If not, then you may need to send me your scene so I can try and debug it directly, otherwise I'm afraid I'd just be guessing, I haven't encountered this problem before. If you can, could you send it to me directly @ support@digital-legacy.co.za and I'll take a look at it as soon as I can.
     
  13. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    i did try it, no luck. i will send you something later, i can;t touch it at the moment.
    anyway, is there a way to change the easing on the page change animation?
     
  14. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    Not specifically the easing, but you can adjust the animation speed by manipulating the "Legacy (Non-ScrollRect) Animation" -> "Animation Speed" property. I'll be moving this property out of the "Legacy" section seeing as it isn't just relevant to legacy PagedRects.
     
  15. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    oh ok, so i can tween the float of Animation Speed on update.
    i've just sent you the scene at the email adress you gave me above
     
  16. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Sorry, it looks like my mailbox was full - the e-mail doesn't seem to have come through. I've cleared out some space, is there any chance you could send it through again?
     
  17. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    forwarded it. the attachment is only 56kb. maybe check spam too?
     
  18. p3gamer

    p3gamer

    Joined:
    Jul 3, 2014
    Posts:
    2
    Swiping or dragging on mobile isn't working well. I've changed the drag threshold as recommended. Also, I have to drag/swipe above or below the page objects within the pagedrect object meaning I cannot swipe over the pages directly.
     
  19. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    What sort of objects are you nesting within the pages? Images, text, etc. all work fine with the examples, and in tests the swiping is also working correctly on mobile.

    Perhaps something in your pages is blocking drag events?
     
  20. p3gamer

    p3gamer

    Joined:
    Jul 3, 2014
    Posts:
    2
    I inserted the Pages Previews - Horizontal prefab and still got the same results. I don't know what I would have that would be blocking my drag via mobile, but not the mouse/keyboard input swiping/dragging.

    Some of my settings:
    I set Drag Threshold to 20
    Disable Dragging set to false
    Use Swipe Input for Scroll Rect

    Would I be able to send you a screenshot of my inspector settings?
     
  21. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    Would it be possible for you to send me your scene so that I can debug it directly? If so, could you send it through to support@digital-legacy.co.za
     
  22. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    how can I switch the page from code, without the animation?
    also, do you have any plans to add an alternative to the linear animation for page switch?
    the method you suggested(changing the animation speed value) produces some pretty crazy results, and it's really hard to control how the animation looks
     
    Last edited: Feb 28, 2018
  23. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    You can set the current page instantly via

    pagedRect.SetCurrentPage(pageNumber, true);

    There aren't any plans to change how the animations work at this point; however there are a few alternatives available. The default mode uses a ScrollRect, but alternatively you can use other animation types (such as fade in/out and slide up/down/left/right) in Legacy PagedRects. You could, in theory, edit those animations if you wish as they are standard Unity UI animations; they are stored in UI/Pagination/Resources/Animation/
     
  24. anubhavaj23

    anubhavaj23

    Joined:
    Dec 21, 2017
    Posts:
    2
    I'm using dynamic page from pagedrect. I have a prefab for page i want to load and prefab for buttons that need to be added in the page all dynamically. I am using it for VR with VRTK. The buttons are showing abrupt behavior with VR pointer. Is there a solution to this? I am placing buttons by altering the localposition inside the page. The behavior is also variable. It seems like the button stays pressed in first couple of pages and in the next few pages, it appears like multiple buttons are being pressed. Thank you for help in advance. Seems like the hover event for VRTK_UICanvas isn't working properly with pagedrect.
     
    Last edited: Mar 16, 2018
  25. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    I'm not entirely certain what the issue is, I've never worked with VRTK, but I imagine it is probably fairly similar to a regular world space canvas, which PagedRect has been tested with successfully.

    One thing that does stand out, however, is that you should probably avoid using localPosition with canvas elements, as it can lead to unexpected positioning issues - rather use 'anchoredPosition' as this property is designed specifically for RectTransforms. It functions in much the same way as localPosition, however, it is more reliable. This is not to say that localPosition cannot be used, just that it may not necessarily work the way you expect.
     
  26. anubhavaj23

    anubhavaj23

    Joined:
    Dec 21, 2017
    Posts:
    2
    Actually, It seems to work fine with mouse, even in world space, but it breaks with VR. Something in pagedrect isn't allowing the buttons hover events to properly respond to vrtk pointer. My work has been really eased by it. If I could just know what went wrong? Any help appreciated. Thankyou
     
  27. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    If you could send through an example project to support@digital-legacy.co.za showcasing the problem so I can debug it directly, I'll look into it and see if I can sort it out for you.
     
  28. one_one

    one_one

    Joined:
    May 20, 2013
    Posts:
    549
    Have there been any attempts to make this asset more GC-friendly (as proposed in a review from 10 months ago)?
     
  29. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    Several changes were made, yes. Most notably, object pooling was introduced for pagination buttons, allowing PagedRect to adjust the pagination as needed without destroying or creating any new objects. These changes were made in v1.38.
     
    one_one likes this.
  30. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    Hi again,

    After updating Unity to 2018, my pages(added from template) no longer do full stretch, only horizontal.

    The template is properly set to full Stretch, but after I hit Play, it turns into Top Stretch. Also, pages are now one on top of the other.

    How can I fix this?
     
    Last edited: May 8, 2018
  31. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    I don't think the change to the page anchor (stretch) properties is the issue here (as it has always functioned this way, even in earlier versions of Unity). While the anchor properties are changed, the page's dimensions and position remain under the control of PagedRect.

    From your screenshot, it looks more to me like the page is improperly positioned vertically, or possibly, just the content is. Could you take a look and see if it is the page or the content which is offset? The easiest way to do this would be to switch to the 'Scene' window and select the page in the hierarchy tab - its outline will then be visible and you can see if it is in the right place or not. Alternatively, you could also set the background color of the page as a test to see if it is in the right place.

    I've tried to replicate the problem, but I've had no luck - everything seems to be positioned correctly.

    Would it be possible for you to send the scene to me so I can debug it directly? If so, can you please e-mail it (or a link to it) to support@digital-legacy.co.za and I'll take a look at it as soon as possible.
     
  32. startleworks

    startleworks

    Joined:
    Jun 8, 2013
    Posts:
    34
    sent mail
     
  33. MohHeader

    MohHeader

    Joined:
    Aug 12, 2015
    Posts:
    31
    Hi,

    nice asset,, super thanks for it.

    I adjusted the code a little bet :

    Added this section

    Code (CSharp):
    1.                
    2.                 if (closestPage.Key == CurrentPage)
    3.                 {
    4.                     var nextclosestPage = pageDistances.OrderBy(p => p.Value).ElementAt(1);
    5.                     if (pageDistances.OrderBy(p => p.Value).First().Value / nextclosestPage.Value > 0.5f)
    6.                         closestPage = nextclosestPage;
    7.                 }
    8.  
    in PagedRect.DragEvents.cs in protected void ScrollToClosestPage()

    that made it more responsive for me, I am trying to make an onboarding page viewer.
    That will make transition from one page to another more easier ( from my point of view )

    Any thoughts about better way to achieve the same effect without editing the original scripts ?

    Thanks,,,
     
  34. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi MohHeader,

    I've just tried that out, and yes, I agree, that does actually feel better. I'm going to integrate it directly into the package so you won't need to find another way to do it :)

    I've implemented much the same way as you have, I've just made some adjustments to keep it as memory-efficient as possible:


    Code (CSharp):
    1.             var pageDistances = GetPageDistancesFromScrollRectCenter().OrderBy(p => p.Value);
    2.          
    3.             if (pageDistances.Any())
    4.             {              
    5.                 var closestPage = pageDistances.First();              
    6.  
    7.                 if (closestPage.Key == CurrentPage && NumberOfPages > 1)
    8.                 {
    9.                     var nextclosestPage = pageDistances.ElementAt(1);
    10.                     if (closestPage.Value / nextclosestPage.Value > 0.5f)
    11.                         closestPage = nextclosestPage;
    12.                 }
    13.  
    14.                 SetCurrentPage(closestPage.Key);
    15.             }
    Thanks for the suggestion! It will be in place for the next version of PagedRect.
     
    zyzyx likes this.
  35. nigel-moore

    nigel-moore

    Joined:
    Aug 28, 2012
    Posts:
    26
    Hi,

    Great asset that I've used previously in VR projects with no problem. _But_ have just imported it into a project we are doing in 2018 and we are getting the same or similar issue mentioned above when using Page Previews. At runtime previously correctly set up pages now offset upwards, even on your example Page Preview scene. From what I can see the 'PosY' parameter of all the pages gets set to zero at runtime returning to the correct 'screen height / 2' when stopped. When trying to interact with them they momentarily drop to the middle of the screen but then the pages seem to get jumbled up and some get rendered on top of others.

    Any ideas?
     
  36. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi,

    Are you using PagedRect v1.47?
    This version was released on Friday and it has a few fixes in place for page positioning in Unity 2018.
     
  37. nigel-moore

    nigel-moore

    Joined:
    Aug 28, 2012
    Posts:
    26
    I downloaded it fresh from the app store yesterday - but when I look at the changelog document it only shows changes for up to v1.46 ...
     
  38. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Odd, I've just checked and the version on the store is definitely v1.47 currently...

    I'll send you a direct download link :)
     
    nigel-moore likes this.
  39. nigel-moore

    nigel-moore

    Joined:
    Aug 28, 2012
    Posts:
    26
    Thanks for that - interestingly the the package exported from 2018 displayed the same strange behaviour but the package exported from 5.4.3 worked perfectly.
     
  40. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    I'm glad it's working, although that's also quite strange. The 2018 version I exported for you was imported into Unity 2018 from the same 5.4.3 package :)

    I primarily develop in 5.4.3 to keep PagedRect compatible with as many versions of Unity as possible - then, after I've made changes, I export those changes to several other Unity versions and test them before submitting anything to the store.

    Oh well, at least it's working :)
     
  41. zukinet

    zukinet

    Joined:
    Oct 30, 2016
    Posts:
    51
    Hi,

    How to use PagedRect API. any short tutorial ?

    i want to change many paramter via script...

    thanks
     
  42. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi there,

    Here's a fairly simple example: https://pastebin.com/kLJFD3Bp

    Note: in this example, the script should be added to the same GameObject as the PagedRect. Alternatively, you could use a public member and set the property via the Inspector UI, or, should you wish to do so, via GameObject.Find().

    The parameters all match their .names in the inspector, and all are publicly accessible. Many also provide a 'Set' method e.g. SetShowPageNumbersOnButtons() which will also call any necessary internal functionality to apply the changes. Others may require you to manually call pagedRect.UpdatePagination() or pagedRect.UpdateDisplay() before they take effect.

    I hope this helps!
     
  43. Nathan-Liu

    Nathan-Liu

    Joined:
    Apr 27, 2017
    Posts:
    8
    I used it in VR, and it works well, but when I use it with CurvedUI, there will be some problems.
    My ScrollRect is curved, and when the number of pages is more than a certain number, the page overlaps, thinking it is a circle to return to the original and the page that is being displayed.
    What should I do to solve this problem, please?
     
  44. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi there,

    I haven't used CurvedUI, so I can't say for sure. You may want to try disabling 'Seamless Looping', perhaps that might help, but I'm not sure. It sounds to me like perhaps ScrollRects don't work properly in CurvedUI, which would be unfortunate.

    Alternatively, you could try using a Legacy PagedRect instead, as these don't use a ScrollRect at all. Instead, they use animations (fade in/out, slide in/out, etc.) to show and hide pages rather than moving through a ScrollRect.
     
  45. Nathan-Liu

    Nathan-Liu

    Joined:
    Apr 27, 2017
    Posts:
    8
    Thank you for your reply! I just tried to use legacy pagedrect to solve my problem perfectly.
    Thanks again!
    Attach a picture of the problem I encountered,I think we can just instantiate three pages to populate the content dynamically, one for the display and the other two for caching. But if we do, I don't know what the pagination should do with more than three pages.
    微信截图_20180808092750.png
     
  46. Daniel-Talis

    Daniel-Talis

    Joined:
    Dec 10, 2011
    Posts:
    394
    I like the look of this asset. Will it work in VR, with Oculus?
     
  47. DaceZA

    DaceZA

    Joined:
    Dec 19, 2014
    Posts:
    170
    Hi there,

    Thanks for your interest!

    Yes, there shouldn't be any problems with Oculus - PagedRect supports World Space canvases and functions in the same way as standard Unity UI elements. As with other Unity UI elements, you'll need to use a VR Input Module / etc. in order for clicks/etc. to be detected, if you're not familiar with this, this tutorial covers this sort of thing fairly extensively:

    https://developer.oculus.com/blog/unitys-ui-system-in-vr/

    I hope this helps!
     
  48. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,337
     
  49. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,337
    Hi, really enjoy using your package.

    I am trying to make a reorderable music playlist for mobile touch devices.
    Would like to be able to drag and drop the rows to reorder the songs.
    Can you advise of how this can be done.

    Cheers.
     
  50. elvezjp

    elvezjp

    Joined:
    May 15, 2017
    Posts:
    1
    Hi there,

    I used "Horizontal Pagination - Scroll Rect" from the prefab.
    But, the scrolling behavior is like a flick rather than a swipe.

    Which parameter should I check?
    And if I have to import any assets, please let me know.
     
unityunity