implementing color wheel and new color picker

This commit is contained in:
2017-11-23 20:26:57 +00:00
parent d44434a458
commit a90aa4a60e
23 changed files with 371 additions and 26 deletions

View File

@@ -243,6 +243,49 @@
</border>
</layout>
<!-- Color Picker Dialog -->
<layout id="color-picker">
<border positioning="absolute" position="0 0" color=".4 .4 .4 .8" width="100%" height="100%" align="center" justify="center">
<border thickness="1" border-color=".2" pad="3">
<border width="300" height="30" color=".2 .2 .2 .9" dir="row" align="center">
<node grow="1" width="10" align="center">
<text id="title" text="Color Picker" font-face="arial" font-size="11"/>
</node>
<combobox justify="flex-end" pad="5" margin="0 5 0 0" text="Triangle" combo-list="Triangle,Square" default="0"/>
</border>
<border width="300" color=".5 .5 .5 .9" pad="10" dir="col">
<colorwheel id="wheel" width="100%" aspect-ratio="1"/>
<node width="100%" pad="2" height="20" dir="row" align="center" margin="10 0 0 0">
<node width="20"><text text="H" font-face="arial" font-size="11"/></node>
<slider-h id="hsv-h" width="10" grow="1" value="1"/>
</node>
<node width="100%" pad="2" height="20" dir="row" align="center">
<node width="20"><text text="S" font-face="arial" font-size="11"/></node>
<slider-h id="hsv-s" width="10" grow="1" value="1"/>
</node>
<node width="100%" pad="2" height="20" dir="row" align="center">
<node width="20"><text text="V" font-face="arial" font-size="11"/></node>
<slider-h id="hsv-v" width="10" grow="1" value="1"/>
</node>
<node width="100%" pad="2" height="20" dir="row" align="center" margin="5 0 0 0">
<node width="20"><text text="R" font-face="arial" font-size="11"/></node>
<slider-h id="rgb-r" width="10" grow="1" value="1"/>
<node width="15" margin="0 0 0 5"><text text="G" font-face="arial" font-size="11"/></node>
<slider-h id="rgb-g" width="10" grow="1" value="1"/>
<node width="15" margin="0 0 0 5"><text text="B" font-face="arial" font-size="11"/></node>
<slider-h id="rgb-b" width="10" grow="1" value="1"/>
</node>
</border>
<node height="33" dir="row" align="flex-end" justify="flex-end">
<button id="btn-ok" text="Reset" width="60" height="30" margin="0 10 0 0"/>
<button id="btn-cancel" text="Select color" width="100" height="30"/>
</node>
</border>
</border>
</layout>
<!-- Dialog Rename Layer -->
<layout id="dialog-layer-rename">
<border positioning="absolute" position="0 0" color=".4 .4 .4 .8" width="100%" height="100%" align="center" justify="center">
@@ -687,7 +730,6 @@
<text text="#opengl #fromscratch #c++" font-face="arial" font-size="11" margin="0 0 0 10" color=".2 .5 1 1"/>
</border>-->
</node>
<!--<ref id="popup-menu"/>-->
<!--<ref id="popup-dialog-open"/>-->
<color-picker/>
</layout>
</root>