Skip to content

Handle auto layout with scaled widget #17822

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 26, 2017
Merged

Handle auto layout with scaled widget #17822

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
822a2fb
handle auto layout with scaled widget
thuydx55 May 16, 2017
792579e
add test for UILayout for Scaled Widget
thuydx55 May 22, 2017
126accd
add test for UILayout - Scaled Widget - JS
thuydx55 May 22, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions cocos/ui/UILayoutManager.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ void LinearHorizontalLayoutManager::doLayout(LayoutProtocol* layout)
{
LinearLayoutParameter::LinearGravity childGravity = layoutParameter->getGravity();
Vec2 ap = child->getAnchorPoint();
Size cs = child->getContentSize();
Size cs = child->getBoundingBox().size;
float finalPosX = leftBoundary + (ap.x * cs.width);
float finalPosY = layoutSize.height - (1.0f - ap.y) * cs.height;
switch (childGravity)
Expand Down Expand Up @@ -115,7 +115,7 @@ void LinearVerticalLayoutManager::doLayout(LayoutProtocol* layout)
{
LinearLayoutParameter::LinearGravity childGravity = layoutParameter->getGravity();
Vec2 ap = subWidget->getAnchorPoint();
Size cs = subWidget->getContentSize();
Size cs = subWidget->getBoundingBox().size;
float finalPosX = ap.x * cs.width;
float finalPosY = topBoundary - ((1.0f-ap.y) * cs.height);
switch (childGravity)
Expand All @@ -136,7 +136,7 @@ void LinearVerticalLayoutManager::doLayout(LayoutProtocol* layout)
finalPosX += mg.left;
finalPosY -= mg.top;
subWidget->setPosition(finalPosX, finalPosY);
topBoundary = subWidget->getPosition().y - subWidget->getAnchorPoint().y * subWidget->getContentSize().height - mg.bottom;
topBoundary = subWidget->getPosition().y - subWidget->getAnchorPoint().y * subWidget->getBoundingBox().size.height - mg.bottom;
}
}
}
Expand Down Expand Up @@ -206,7 +206,7 @@ Widget* RelativeLayoutManager::getRelativeWidget(Widget* widget)
bool RelativeLayoutManager::calculateFinalPositionWithRelativeWidget(LayoutProtocol *layout)
{
Vec2 ap = _widget->getAnchorPoint();
Size cs = _widget->getContentSize();
Size cs = _widget->getBoundingBox().size;

_finalPositionX = 0.0f;
_finalPositionY = 0.0f;
Expand Down Expand Up @@ -280,7 +280,7 @@ bool RelativeLayoutManager::calculateFinalPositionWithRelativeWidget(LayoutProto
{
return false;
}
Size rbs = relativeWidget->getContentSize();
Size rbs = relativeWidget->getBoundingBox().size;
float locationTop = relativeWidget->getTopBoundary();

_finalPositionY = locationTop + ap.y * cs.height;
Expand Down Expand Up @@ -320,7 +320,7 @@ bool RelativeLayoutManager::calculateFinalPositionWithRelativeWidget(LayoutProto
{
return false;
}
Size rbs = relativeWidget->getContentSize();
Size rbs = relativeWidget->getBoundingBox().size;
float locationLeft = relativeWidget->getLeftBoundary();
_finalPositionX = locationLeft - (1.0f - ap.x) * cs.width;

Expand Down Expand Up @@ -360,7 +360,7 @@ bool RelativeLayoutManager::calculateFinalPositionWithRelativeWidget(LayoutProto
{
return false;
}
Size rbs = relativeWidget->getContentSize();
Size rbs = relativeWidget->getBoundingBox().size;
float locationRight = relativeWidget->getRightBoundary();
_finalPositionX = locationRight + ap.x * cs.width;

Expand Down Expand Up @@ -400,7 +400,7 @@ bool RelativeLayoutManager::calculateFinalPositionWithRelativeWidget(LayoutProto
{
return false;
}
Size rbs = relativeWidget->getContentSize();
Size rbs = relativeWidget->getBoundingBox().size;
float locationBottom = relativeWidget->getBottomBoundary();

_finalPositionY = locationBottom - (1.0f - ap.y) * cs.height;
Expand Down
8 changes: 4 additions & 4 deletions cocos/ui/UIWidget.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1125,22 +1125,22 @@ bool Widget::isEnabled() const

float Widget::getLeftBoundary() const
{
return getPosition().x - getAnchorPoint().x * _contentSize.width;
return getBoundingBox().origin.x;
}

float Widget::getBottomBoundary() const
{
return getPosition().y - getAnchorPoint().y * _contentSize.height;
return getBoundingBox().origin.y;
}

float Widget::getRightBoundary() const
{
return getLeftBoundary() + _contentSize.width;
return getLeftBoundary() + getBoundingBox().size.width;
}

float Widget::getTopBoundary() const
{
return getBottomBoundary() + _contentSize.height;
return getBottomBoundary() + getBoundingBox().size.height;
}

const Vec2& Widget::getTouchBeganPosition()const
Expand Down
57 changes: 57 additions & 0 deletions tests/cpp-tests/Classes/UITest/CocoStudioGUITest/UILayoutTest/UILayoutTest.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ UILayoutTests::UILayoutTests()
ADD_TEST_CASE(UILayoutTest_Layout_Linear_Horizontal);
ADD_TEST_CASE(UILayoutTest_Layout_Relative_Align_Parent);
ADD_TEST_CASE(UILayoutTest_Layout_Relative_Location);
ADD_TEST_CASE(UILayoutTest_Layout_Scaled_Widget);
ADD_TEST_CASE(UILayoutComponentTest);
ADD_TEST_CASE(UILayoutComponent_Berth_Test);
ADD_TEST_CASE(UILayoutComponent_Berth_Stretch_Test);
Expand Down Expand Up @@ -726,6 +727,62 @@ bool UILayoutTest_Layout_Relative_Location::init()
return false;
}

// UILayoutTest_Layout_Relative_Location

UILayoutTest_Layout_Scaled_Widget::UILayoutTest_Layout_Scaled_Widget()
{
}

UILayoutTest_Layout_Scaled_Widget::~UILayoutTest_Layout_Scaled_Widget()
{
}

bool UILayoutTest_Layout_Scaled_Widget::init()
{
if (UIScene::init())
{
Size widgetSize = _widget->getContentSize();

// Add the alert
Text* alert = Text::create("Layout Scaled Widget", "fonts/Marker Felt.ttf", 20);
alert->setColor(Color3B(159, 168, 176));
alert->setPosition(Vec2(widgetSize.width / 2.0f, widgetSize.height / 2.0f - alert->getContentSize().height * 4.5f));
_uiLayer->addChild(alert);

Layout* root = static_cast<Layout*>(_uiLayer->getChildByTag(81));

Layout* background = dynamic_cast<Layout*>(root->getChildByName("background_Panel"));

// Create the layout
Layout* layout = Layout::create();
layout->setLayoutType(Layout::Type::HORIZONTAL);
layout->setContentSize(Size(280, 150));
Size backgroundSize = background->getContentSize();
layout->setPosition(Vec2((widgetSize.width - backgroundSize.width) / 2.0f +
(backgroundSize.width - layout->getContentSize().width) / 2.0f,
(widgetSize.height - backgroundSize.height) / 2.0f +
(backgroundSize.height - layout->getContentSize().height) / 2.0f));
_uiLayer->addChild(layout);

ImageView* imageView_Center1 = ImageView::create("cocosui/scrollviewbg.png");
imageView_Center1->setScale(0.5);
layout->addChild(imageView_Center1);

ImageView* imageView_Center2 = ImageView::create("cocosui/scrollviewbg.png");
imageView_Center2->setScale(1.2);
layout->addChild(imageView_Center2);

ImageView* imageView_Center3 = ImageView::create("cocosui/scrollviewbg.png");
imageView_Center3->setScale(0.8);
layout->addChild(imageView_Center3);

return true;
}

return false;
}


bool UILayoutComponentTest::init()
{
if (UIScene::init())
Expand Down
10 changes: 10 additions & 0 deletions tests/cpp-tests/Classes/UITest/CocoStudioGUITest/UILayoutTest/UILayoutTest.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -123,6 +123,16 @@ class UILayoutTest_Layout_Relative_Location : public UIScene
CREATE_FUNC(UILayoutTest_Layout_Relative_Location);
};

class UILayoutTest_Layout_Scaled_Widget : public UIScene
{
public:
UILayoutTest_Layout_Scaled_Widget();
~UILayoutTest_Layout_Scaled_Widget();
virtual bool init() override;

CREATE_FUNC(UILayoutTest_Layout_Scaled_Widget);
};

class UILayoutComponentTest : public UIScene
{
public:
Expand Down
42 changes: 42 additions & 0 deletions tests/js-tests/src/GUITest/UILayoutTest/UILayoutTest.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -406,6 +406,48 @@ var UILayoutTest_Layout_Relative_Location = UIMainLayer.extend({
}
});

var UILayoutTest_Layout_Scaled_Widget = UIMainLayer.extend({
init: function(){
if (this._super()) {
var widgetSize = this._widget.getContentSize();

// Add the alert
var alert = new ccui.Text("Layout Scaled Widget", "Marker Felt", 20);
alert.setColor(cc.color(159, 168, 176));
alert.setPosition(widgetSize.width / 2.0, widgetSize.height / 2.0 - alert.height * 4.5);
this._mainNode.addChild(alert);

var root = this._mainNode.getChildByTag(81);
var background = root.getChildByName("background_Panel");

// Create the layout
var layout = new ccui.Layout();
layout.setLayoutType(ccui.Layout.LINEAR_HORIZONTAL);
layout.setContentSize(280, 150);
var backgroundSize = background.getContentSize();
layout.setPosition((widgetSize.width - backgroundSize.width) / 2.0 + (backgroundSize.width - layout.width) / 2.0,
(widgetSize.height - backgroundSize.height) / 2.0 + (backgroundSize.height - layout.height) / 2.0 );
this._mainNode.addChild(layout);

// center
var imageView_Center1 = new ccui.ImageView("ccs-res/cocosui/scrollviewbg.png");
imageView_Center1.scale = 0.5;
layout.addChild(imageView_Center1);

var imageView_Center2 = new ccui.ImageView("ccs-res/cocosui/scrollviewbg.png");
imageView_Center2.scale = 1.2;
layout.addChild(imageView_Center2);

var imageView_Center3 = new ccui.ImageView("ccs-res/cocosui/scrollviewbg.png");
imageView_Center3.scale = 0.8;
layout.addChild(imageView_Center3);

return true;
}
return false;
}
});

var UILayoutComponentTest = UIMainLayer.extend({
_baseLayer: null,
init: function(){
Expand Down
6 changes: 6 additions & 0 deletions tests/js-tests/src/GUITest/UISceneManager.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -410,6 +410,12 @@
return new UILayoutTest_Layout_Relative_Location();
}
},
{
title: "UILayoutTest_Layout_Scaled_Widget",
func: function () {
return new UILayoutTest_Layout_Scaled_Widget();
}
},
{
title: "UILayoutComponent_Berth_Test",
func: function () {
Expand Down