PageView how to use?

PageView how to use?
0.0 0


Did you ever seen Material Design? Android had a good design language. The iOS Guidelines are a joke compared to that.

But I don’t want to argue with you…

PS: Quality is the best joke I’ve heard about Apple the last weeks - “Login with root without password” is really a proof, that their quality is unbeatable.


If you need to use PageView there is a hack you can use. Create a class called something like PageViewCustom and use this:


#include "ui/CocosGUI.h"
using namespace cocos2d::ui;

class PageViewCustom : public PageView {

    virtual void remedyLayoutParameter(Widget *item);


#include "PageViewCustom.h"

void PageViewCustom::remedyLayoutParameter(cocos2d::ui::Widget *item) {

Now just use PageViewCustom::create() instead of PageView::create(). This will prevent the PageView from resizing your Layout nodes. Just set your Layout nodes to half the width of your PageView (that is, your PageViewCustom) and you should get the effect you want.


I just finished such class :slight_smile: 5 min later I waned to write here.
Yes, it’s works, but another problem:

From right side, when PageView bounces - it’s jumps somewhere random position in the list…


It does not do this for me. What else has changed with your code?


Well, looks like nothing… it’s same code as in 1-st post, except it ofc uses PageViewCustom now.
Also, I’m adding 16 items. and some misc: setItemsMargin(35.0f); items size is 52px square.

Just checked, added up to 8 items - no problems, but with 9+ items I got this bounce back problem.


Odd. I have a 300x130 PageViewCustom with items margin set to 35 and 16 Layout nodes added with a size of 52x52, and I am not getting this issue.


Hmm… thats very strange, I’m now moved my code(from the actual game, as was gif example showed) to UIPageViewTest and just edited source main PageView.cpp and disabled item->setContentSize(this->getContentSize());
and got no problems there too…

Upd: found code to reproduce issue(my bad with sizes, tweaked code from my game for diff size):

// Create the page view
    Size pageViewSize(209.1, 70.0);
    Size pageSize(26, 26);
    PageView* pageView = PageView::create();
    Size backgroundSize = background->getContentSize();
    pageView->setPosition((widgetSize - pageView->getContentSize()) / 2.0f);

    for (int i = 1; i < 10; ++i)
        Layout* layout = Layout::create();
        ImageView* imageView = ImageView::create("cocosui/scrollviewbg.png");
        imageView->setPosition(Vec2(layout->getContentSize().width / 2.0f, layout->getContentSize().height / 2.0f));
        Text* label = Text::create(StringUtils::format("page %d",(i)), "fonts/Marker Felt.ttf", 15);
        label->setColor(Color3B(192, 192, 192));
        label->setPosition(Vec2(layout->getContentSize().width / 2.0f, layout->getContentSize().height / 2.0f));

I think it’s something with pageViewSize…


Also, I’ve added debug for center

LayerColor *layer = LayerColor::create(Color4B(0, 255, 0, 255), 2, 2);
layer->setPosition(Vec2(pageView->getPosition().x + pageView->getContentSize().width * 0.5, pageView->getPosition().y + 50.0));

and notice that center view is not centered… which should be: setMagneticType(MagneticType::CENTER);

Another bug of this component as I see. One screen shoot from my game scene and other from tests.
It’s clearly noticeable not centered item.


LayerColor (and Layer) has an anchor point of (0, 0). Try this and see if it fixes it:

layer->setAnchorPoint(Vec2(.5f, .5f));


I just ised it for debug, for my game there are noticeable not centered problem compare to other items. I can use just maybe some sprite for debug, but I just want to say that problem is there. I have small items and it’s more noticeable.

upd: found some specific scale for node in my game. Fixed it and now everything ok, center was not a problem with PageView.
So almost fixed buggy built in class :slight_smile: That glitch with jumping to some page…


This topic is now closed due to the off topic posts and memes I had to delete. Please do not start another topic about this unless if becomes relevant again.




I’ll re-open this topic since @KAMIKAZE still has concerns related to it. Let’s keep the posts on topic. This means about PageView.


This bug scroll jumps glitch from the end
Is still there, Jan 9.
Anyone know how to fix? Any engine developers are even checked&reproduced this?
There are some pull request even attempting to fix this, and it’s almost fixed, just page scrolls too slow from the right part.