Hi dear community,
I am totally new to wearable dev, so I was hoping for an easy way to create a WYSIWYG layout using the UI Builder, but nothing seems to work out of the box for me… I used several other IDEs in the past, so it is a bit embarrasing to already fail at the basics 
. Found the UI Builder documentation and regarding forum content to be pretty scarce, so maybe you can help me with some of my issues and tell me what I am doing wrong.
Settings
- Tizen Studio version : 3.6
- Target device : Samsung Galaxy Watch
- Template : Wearable v4.0 / Native App / UI Builder - Single View (Circle)
1. Background not displayed
- Added a new view, put in a box container, and then added a background component
- Set the image path to the .png I saved in the /res folder (full path: C:\tizen-studio\workspaces\UIBuilderSingleView\res\images\background.png)
- In the editor it is displayed correctly, but in the emulator and on the watch only the blank white background color is displayed
- Changing the options (scale, stretch, etc.) did not help
- Manually removing the color attribute in the Source Editor only results in a blank black screen instead
2. Genlist not scrollable to the end
- Added box container to start view, inserted Genlist component to the box
- Created a handful of items using the button in the properties tab of the genlist
- In the emulator and on the watch, I am only able to get to the penultimate entry scrolling with the bezel or by touch
- Misusing an additional entry using the groupindex style as some kind of footer also does not make the last entry selectable, although when it becomes visible, I can select it by tap and the assigned link works
- Using the grid component instead of the box and not using the title style only results in neither the first and last item being selectable
3. Icon not displayed for 2text.1icon.1 style
- Assigned 2text.1icon.1 style to the second item of the Genlist and entered image path
- Again, the icon is displayed in the Design Editor; although it is placed to the right, where I expect the end icon to go
- In the emulator no icon is visible, but the item text is slightly indented as if there were an item
- I was aiming for the layout of the watch’s options menu list
Thanks for reading this far and thank you even more for any help! I feel like I am just doing some stupid noob mistakes or simply not seeing something, so I am very grateful for any nudge in the right direction. 
Cheers,
the-Mace
Thank you!
I came across the Tizen Developer tutorials, but was hoping to get around coding by using the UI Builder, though there seems no way around it and might come in handy in the future. Can I implement this code in an existing UI Builder project and have it visually represented in the editor or just by using the emulator?
SOLVED: 1. Background not displayed
original issue
- Added a new view, put in a box container, and then added a background component
- Set the image path to the .png I saved in the /res folder (full path: C:\tizen-studio\workspaces\UIBuilderSingleView\res\images\background.png)
- In the editor it is displayed correctly, but in the emulator and on the watch only the blank white background color is displayed
- Changing the options (scale, stretch, etc.) did not help
- Manually removing the color attribute in the Source Editor only results in a blank black screen instead
Instead of using the full hard drive file path, I simply had to put in “images/background.png” 
WORKAROUND: 2. Genlist not scrollable to the end
original issue
- Added box container to start view, inserted Genlist component to the box
- Created a handful of items using the button in the properties tab of the genlist
- In the emulator and on the watch, I am only able to get to the penultimate entry scrolling with the bezel or by touch
- Misusing an additional entry using the groupindex style as some kind of footer also does not make the last entry selectable, although when it becomes visible, I can select it by tap and the assigned link works
- Using the grid component instead of the box and not using the title style only results in neither the first and last item being selectable
Not really a satisfying solution, but by adding an additional item to the list with just a space " " for the text creates a blank item at the end, so at least the penultimate item is selectable now.
1 Like
PARTLY SOLVED: 3. Icon not displayed for 2text.1icon.1 style
original issue
- Assigned 2text.1icon.1 style to the second item of the Genlist and entered image path
- Again, the icon is displayed in the Design Editor; although it is placed to the right, where I expect the end icon to go
- In the emulator no icon is visible, but the item text is slightly indented as if there were an item
- I was aiming for the layout of the watch’s options menu list
Like with issue #1, the solution was to put in the correct path to the picture “images/icon.png”
Although I still only get to have it displayed to the right of the text instead of to the left, but I will continue to fiddle around here.