CODEWITHSUNDEEP
codenameone
Jordan Rey
Jordan Rey

Reputation: 21

Having trouble creating this Form in the GUI Builder

I have this picture of a Form that I want to re-create in Codename One UI design, but I'm stuck at separating the two buttons by a white line. See image below to give me an idea of how to achieve this:

Form to be recr-eated

Upvotes: 0

Views: 123

Answers (1)

Diamond
Diamond

Reputation: 7483

In this type of design, you will have to extract the text/buttons from the background image. Follow these steps:

  1. Remove Cather and Gifter buttons with their slogan from the background.
  2. Add the background image to your theme.res and create a custom form uiid which will have background image scaled to fill.
  3. Set your form's layout to GridLayout with 2 rows and 1 column.
  4. Add 2 containers to your form (top and bottom) and set their Layouts to new BorderLayout(BorderLayout.CENTER_BEHAVIOR_CENTER).
  5. Inside each container, add another container with layout set as BoxLayout.y().
  6. Inside this final BoxLayout containers, that's where you will add Cather and Gifter buttons with their slogans as Labels.

Upvotes: 3

Related Questions