LabelRecipe::LabelRecipe(Container *parent) : CustomControl(parent) { Container *recipeContainer = new Container(); StackLayout *recipeLayout = new StackLayout(); recipeLayout->setLayoutDirection(LayoutDirection::LeftToRight); recipeContainer->setLayout(recipeLayout); // Here all the available bold type fonts are stacked in a Container. Container *headerStyleContainer = new Container(); headerStyleContainer->setLayoutProperties( DockLayoutProperties::create().horizontal(HorizontalAlignment::Center).vertical( VerticalAlignment::Center)); headerStyleContainer->setRightMargin(60); headerStyleContainer->add( setUpLabelWithStyle((const QString) "BigText", SystemDefaults::TextStyles::bigText(), true, Color::Gray , true)); headerStyleContainer->add( setUpLabelWithStyle((const QString) "TitleText", SystemDefaults::TextStyles::titleText(), true, Color::Gray, true)); headerStyleContainer->add( setUpLabelWithStyle((const QString) "BodyText", SystemDefaults::TextStyles::bodyText(), true, Color::Gray, true)); headerStyleContainer->add( setUpLabelWithStyle((const QString) "SubtitleText", SystemDefaults::TextStyles::subtitleText(), true, Color::Gray, true )); headerStyleContainer->add( setUpLabelWithStyle((const QString) "SmallText", SystemDefaults::TextStyles::smallText(), true, Color::Gray, true)); // The second stacked Container show the regular style fonts. Container *paragraphStyleContainer = new Container(); paragraphStyleContainer->add( setUpLabelWithStyle((const QString) "BigText", SystemDefaults::TextStyles::bigText(), false, Color::Gray, false)); paragraphStyleContainer->add( setUpLabelWithStyle((const QString) "TitleText", SystemDefaults::TextStyles::titleText(), false, Color::Gray, false)); paragraphStyleContainer->add( setUpLabelWithStyle((const QString) "BodyText", SystemDefaults::TextStyles::bodyText(), false, Color::Gray, false)); paragraphStyleContainer->add( setUpLabelWithStyle((const QString) "SubtitleText", SystemDefaults::TextStyles::subtitleText(), false, Color::Gray, false)); paragraphStyleContainer->add( setUpLabelWithStyle((const QString) "SmallText", SystemDefaults::TextStyles::smallText(), false, Color::Gray, false)); recipeContainer->add(headerStyleContainer); recipeContainer->add(paragraphStyleContainer); setRoot(recipeContainer); }
SelectionCheckBox::SelectionCheckBox(Container * parent) : CustomControl(parent) { Container *checkBoxComponent = new Container(); DockLayout *checkBoxComponentLayout = new DockLayout(); checkBoxComponentLayout->setTopPadding(41.0f); checkBoxComponentLayout->setBottomPadding(41.0f); checkBoxComponent->setPreferredWidth(600.0f); checkBoxComponent->setLayout(checkBoxComponentLayout); this->setLayoutProperties( StackLayoutProperties::create().horizontal(HorizontalAlignment::Fill)); // The title is stored in the custom control so that we can present which olive // has been added or removed from the mix. mTitle = QString(""); mTitleLabel = new Label(); mTitleLabel->setText(mTitle); mTitleLabel->textStyle()->setBase(SystemDefaults::TextStyles::titleText()); mTitleLabel->setLayoutProperties( DockLayoutProperties::create().vertical(VerticalAlignment::Center)); // A colored rectangle representing the olive color and the // CheckBox is aligned to the Right side of the component. Container *checkBoxContainer = new Container(); StackLayout *checkBoxLayout = new StackLayout(); checkBoxLayout->setLayoutDirection(LayoutDirection::LeftToRight); // A colored rectangle representing the olive color and the // CheckBox is aligned to the Right side of the component. checkBoxContainer->setLayout(checkBoxLayout); checkBoxContainer->setLayoutProperties( DockLayoutProperties::create().horizontal(HorizontalAlignment::Right)); mColorContainer = new Container(); mColorContainer->setBackground(Color::Black); mColorContainer->setPreferredSize(42, 42); mColorContainer->setRightMargin(33.0f); mColorContainer->setLayoutProperties( StackLayoutProperties::create().vertical(VerticalAlignment::Center)); // The CheckBox which will tell if the olive should be part of the // olive mix or not. CheckBox *oliveCheckBox = new CheckBox(); oliveCheckBox->setObjectName("checkBox"); connect(oliveCheckBox, SIGNAL(checkedChanged(bool)), this, SLOT(onCheckedChanged(bool))); checkBoxContainer->add(mColorContainer); checkBoxContainer->add(oliveCheckBox); checkBoxComponent->add(mTitleLabel); checkBoxComponent->add(checkBoxContainer); // To get a behavior that is consistent with how the RadioGroupOptions work // we need to change the checked state when interacting with the entire // check box option (not only the check box itself). So we listen for // touch events on the entire Container and keep track of if the press // down occurred on the Container connect(checkBoxComponent, SIGNAL(touch(bb::cascades::TouchEvent *)), this, SLOT(onCheckBoxComponentTouch(bb::cascades::TouchEvent *))); setRoot(checkBoxComponent); }
RecipeItem::RecipeItem(Container *parent) : CustomControl(parent) { // Dock layout with margins inside. Container *itemContainer = new Container(); DockLayout *itemLayout = new DockLayout(); itemContainer->setLayout(itemLayout); itemContainer->setPreferredWidth(768.0f); // A background Container that will hold a background image and a item content Container. Container *backgroundContainer = new Container(); DockLayout *backgroundLayout = new DockLayout(); backgroundContainer->setLayout(backgroundLayout); backgroundContainer->setLayoutProperties( DockLayoutProperties::create().horizontal(HorizontalAlignment::Center)); // The white background item image. ImageView *bkgImage = ImageView::create("asset:///images/white_photo.png").preferredSize(768.0f, 173.0f); // A Colored Container will be used to show if an item is highlighted. mHighlighContainer = new Container(); mHighlighContainer->setBackground(Color::fromARGB(0xff75b5d3)); mHighlighContainer->setLayoutProperties(DockLayoutProperties::create().horizontal(HorizontalAlignment::Center)); mHighlighContainer->setOpacity(0.0); mHighlighContainer->setPreferredWidth(760.0f); mHighlighContainer->setPreferredHeight(168.0f); // Content Container, Image + text with padding to get alignment on background image. Container *contentContainer = new Container(); StackLayout *contentLayout = new StackLayout(); contentLayout->setLayoutDirection(LayoutDirection::LeftToRight); contentLayout->setLeftPadding(3.0f); contentContainer->setLayout(contentLayout); // The list item image, docked to the top, the actual image is set in updateItem. mItemImage = ImageView::create("asset:///images/white_photo.png").preferredSize(250.0f, 168.0f).layoutProperties( StackLayoutProperties::create().vertical(VerticalAlignment::Top)); // A list item label, docked to the center, the text is set in updateItem. mItemLabel = Label::create().text(" ").layoutProperties( StackLayoutProperties::create().vertical(VerticalAlignment::Center)).leftMargin(30.0f); mItemLabel->textStyle()->setBase(SystemDefaults::TextStyles::titleText()); mItemLabel->textStyle()->setColor(Color::Black); // Add the Image and Label to the content. contentContainer->add(mItemImage); contentContainer->add(mItemLabel); // Add the background image and the content to the full item container. backgroundContainer->add(bkgImage); backgroundContainer->add(mHighlighContainer); backgroundContainer->add(contentContainer); // Finally add the background Container to the item Container. itemContainer->add(backgroundContainer); setRoot(itemContainer); }