Skip to content
This repository has been archived by the owner on Jun 17, 2024. It is now read-only.

Commit

Permalink
feat: add radio
Browse files Browse the repository at this point in the history
  • Loading branch information
lc-soft committed Sep 8, 2019
1 parent 05f5e50 commit b259bad
Show file tree
Hide file tree
Showing 17 changed files with 434 additions and 7 deletions.
5 changes: 5 additions & 0 deletions demo/app/assets/views/documentation.xml
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,11 @@
Rate
</a>
</w>
<w class="nav-item">
<a class="nav-link" href="components/radio.xml" target="demo-content">
Radio
</a>
</w>
<w class="nav-item">
<a class="nav-link" href="components/modal.xml" target="demo-content">
Modal
Expand Down
8 changes: 4 additions & 4 deletions demo/app/assets/views/home.xml
Original file line number Diff line number Diff line change
Expand Up @@ -3,19 +3,19 @@
<ui>
<w class="home-masthead">
<w class="container">
<w type="h1">LCUI.css</w>
<w type="h1">LC Design</w>
<w type="p" class="lead">
A UI component framework for building LCUI application.
</w>
<w type="p" class="lead mb-4">
LCUI.css is an open source toolkit for developing with XML, CSS, and C. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, simple grid system, common prebuilt components.
LC Design is an open source toolkit for developing with XML, CSS, and C. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, simple grid system, common prebuilt components.
</w>
<w class="lead mb-3">
<w class="lead button-container">
<w type="a" href="documentation.xml" target="demo-body" key="docs" class="btn btn-outline-purple btn-lg mr-3">Get started</w>
<w type="a" href="https://github.com/lc-ui/lcui.css/releases" class="btn btn-outline-secondary btn-lg">Download</w>
</w>
<w type="p" class="text-muted">
Currently v.0.1.2
Currently v.1.0.0
</w>
</w>
</w>
Expand Down
27 changes: 27 additions & 0 deletions docs/components/radio.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
# Radio

Select one of a set of options.

## Basic

``` radio-basic-demo-xml
<radio>Radio</radio>
```

## Disabled

``` radio-disabled-demo-xml
<radio disabled="disabled">Disabled</radio>
<radio disabled="disabled" checked="checked">Disabled</radio>
```

## Group

``` radio-group-demo-xml
<radio-group>
<radio value="1" checked="checked">A</radio>
<radio value="2">B</radio>
<radio value="3">C</radio>
<radio value="4">D</radio>
</radio-group>
```
2 changes: 2 additions & 0 deletions include/LCDesign/ui/components.h
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,8 @@
#include <LCDesign/ui/components/label.h>
#include <LCDesign/ui/components/icon.h>
#include <LCDesign/ui/components/checkbox.h>
#include <LCDesign/ui/components/radio.h>
#include <LCDesign/ui/components/radio-group.h>
#include <LCDesign/ui/components/img.h>
#include <LCDesign/ui/components/rate.h>
#include <LCDesign/ui/components/spinner.h>
Expand Down
42 changes: 42 additions & 0 deletions include/LCDesign/ui/components/radio-group.h
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
/*
* radio-group.h -- Radio group
*
* Copyright (c) 2019, Liu chao <[email protected]> All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions are met:
*
* * Redistributions of source code must retain the above copyright notice,
* this list of conditions and the following disclaimer.
* * Redistributions in binary form must reproduce the above copyright
* notice, this list of conditions and the following disclaimer in the
* documentation and/or other materials provided with the distribution.
* * Neither the name of LCUI nor the names of its contributors may be used
* to endorse or promote products derived from this software without
* specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
* AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
* IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
* ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
* LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
* CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
* SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
* INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
* CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
* ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
* POSSIBILITY OF SUCH DAMAGE.
*/

#ifndef LCDESIGN_RADIO_GROUP_H_
#define LCDESIGN_RADIO_GROUP_H_

int RadioGroup_SetCheckedRadio(LCUI_Widget w, LCUI_Widget radio);

int RadioGroup_SetValue(LCUI_Widget w, const char *value);

const char *RadioGroup_GetValue(LCUI_Widget w);

void LCDesign_InitRadioGroup(void);

#endif
38 changes: 38 additions & 0 deletions include/LCDesign/ui/components/radio.h
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
/*
* radio.h -- Radio, used to select one of a set of options.
*
* Copyright (c) 2019, Liu chao <[email protected]> All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions are met:
*
* * Redistributions of source code must retain the above copyright notice,
* this list of conditions and the following disclaimer.
* * Redistributions in binary form must reproduce the above copyright
* notice, this list of conditions and the following disclaimer in the
* documentation and/or other materials provided with the distribution.
* * Neither the name of LCUI nor the names of its contributors may be used
* to endorse or promote products derived from this software without
* specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
* AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
* IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
* ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
* LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
* CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
* SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
* INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
* CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
* ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
* POSSIBILITY OF SUCH DAMAGE.
*/

#ifndef LCDESIGN_RADIO_H_
#define LCDESIGN_RADIO_H_

void Radio_SetChecked(LCUI_Widget w, LCUI_BOOL checked);

void LCDesign_InitRadio(void);

#endif
4 changes: 4 additions & 0 deletions main.vcxproj
Original file line number Diff line number Diff line change
Expand Up @@ -169,6 +169,8 @@
<ClCompile Include="src\ui\components\label.c" />
<ClCompile Include="src\ui\components\modal.c" />
<ClCompile Include="src\ui\components\password.c" />
<ClCompile Include="src\ui\components\radio-group.c" />
<ClCompile Include="src\ui\components\radio.c" />
<ClCompile Include="src\ui\components\rate.c" />
<ClCompile Include="src\ui\components\spinner.c" />
<ClCompile Include="src\ui\components\switch.c" />
Expand All @@ -188,6 +190,8 @@
<ClInclude Include="include\LCDesign\ui\components\label.h" />
<ClInclude Include="include\LCDesign\ui\components\modal.h" />
<ClInclude Include="include\LCDesign\ui\components\password.h" />
<ClInclude Include="include\LCDesign\ui\components\radio-group.h" />
<ClInclude Include="include\LCDesign\ui\components\radio.h" />
<ClInclude Include="include\LCDesign\ui\components\rate.h" />
<ClInclude Include="include\LCDesign\ui\components\spinner.h" />
<ClInclude Include="include\LCDesign\ui\components\switch.h" />
Expand Down
4 changes: 4 additions & 0 deletions main.vcxproj.filters
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@
<ClCompile Include="src\ui\components\tooltip.c" />
<ClCompile Include="src\ui\components\checkbox.c" />
<ClCompile Include="src\ui\components\switch.c" />
<ClCompile Include="src\ui\components\radio.c" />
<ClCompile Include="src\ui\components\radio-group.c" />
</ItemGroup>
<ItemGroup>
<ClInclude Include="include\LCDesign.h" />
Expand All @@ -36,5 +38,7 @@
<ClInclude Include="include\LCDesign\ui\components\tooltip.h" />
<ClInclude Include="include\LCDesign\ui\components\checkbox.h" />
<ClInclude Include="include\LCDesign\ui\components\switch.h" />
<ClInclude Include="include\LCDesign\ui\components\radio.h" />
<ClInclude Include="include\LCDesign\ui\components\radio-group.h" />
</ItemGroup>
</Project>
2 changes: 2 additions & 0 deletions src/main.c
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,8 @@ void LCDesign_Init(void)
{
LCDesign_InitAlert();
LCDesign_InitCheckBox();
LCDesign_InitRadio();
LCDesign_InitRadioGroup();
LCDesign_InitLabel();
LCDesign_InitIcon();
LCDesign_InitImg();
Expand Down
3 changes: 2 additions & 1 deletion src/scss/_checkbox.scss
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,12 @@
}

.checkbox-text {
margin-left: map-get($spacers, 2);
padding: 0 map-get($spacers, 2);
}

checkbox {
display: inline-block;
margin-right: map-get($spacers, 2);

&:hover .checkbox-inner {
border-color: $checkbox-checked-color;
Expand Down
51 changes: 51 additions & 0 deletions src/scss/_radio.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
.radio-inner {
width: $radio-size;
height: $radio-size;
border: $radio-border-width solid $radio-border-color;
border-radius: $radio-size / 2;
display: inline-block;
vertical-align: middle;
}

.radio-inner-icon {
background-color: $radio-checked-color;
width: $radio-inner-icon-size;
height: $radio-inner-icon-size;
border-radius: $radio-inner-icon-size / 2;
margin: $radio-inner-icon-margin;
display: none;
}

.radio-text {
padding: 0 map-get($spacers, 2);
}

radio {
display: inline-block;
margin-right: map-get($spacers, 2);

&:hover .radio-inner {
border-color: $radio-checked-color;
}

&.checked {
.radio-inner {
border-color: $radio-checked-color;
}
.radio-inner-icon {
display: block;
}
}
&:disabled {
.radio-inner {
border-color: $radio-border-color;
background-color: $radio-disabled-bg;
}
.radio-inner-icon {
background-color: $radio-disabled-color;
}
.radio-text {
color: $radio-disabled-color;
}
}
}
2 changes: 2 additions & 0 deletions src/scss/_switch.scss
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
.switch-slider {
background-color: #fff;
width: $switch-slider-width;
border-radius: $switch-border-radius;
height: 100%;
}

Expand All @@ -31,6 +32,7 @@
height: $switch-height;
display: inline-block;
border: $switch-border-width solid $switch-color;
border-radius: $switch-border-radius;
background-color: $switch-color;

&.checked {
Expand Down
15 changes: 14 additions & 1 deletion src/scss/_variables.scss
Original file line number Diff line number Diff line change
Expand Up @@ -568,9 +568,10 @@ $rate-star-void-color: $gray-400 !default;

$switch-height: 20px;
$switch-border-width: 2px;
$switch-border-radius: $switch-height / 2;
$switch-margin-left: $font-size-base / 2;
$switch-slider-width: $switch-height - $switch-border-width * 2;
$switch-icon-width: $switch-height + $switch-border-width * 2;
$switch-icon-width: $switch-height;
$switch-icon-height: $switch-height - $switch-border-width * 2;
$switch-bar-width: $switch-icon-width * 2 + $switch-slider-width;
$switch-width: $switch-icon-width + $switch-slider-width + $switch-border-width * 2;
Expand All @@ -586,3 +587,15 @@ $checkbox-border-color: $border-color;
$checkbox-checked-color: $primary;
$checkbox-disabled-bg: $gray-100;
$checkbox-disabled-color: $gray-600;


// Radio

$radio-size: $font-size-base + 2px;
$radio-border-width: 1px;
$radio-border-color: $border-color;
$radio-inner-icon-margin: 3px;
$radio-inner-icon-size: $radio-size - $radio-border-width * 2 - $radio-inner-icon-margin * 2;
$radio-checked-color: $primary;
$radio-disabled-bg: $gray-100;
$radio-disabled-color: $gray-600;
1 change: 1 addition & 0 deletions src/scss/lc-design.scss
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
@import "navbar";
@import "buttons";
@import "checkbox";
@import "radio";
@import "dropdown";
@import "list-group";
@import "rate";
Expand Down
2 changes: 1 addition & 1 deletion src/ui/components/checkbox.c
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ static void CheckBox_OnInit(LCUI_Widget w)
Widget_BindEvent(w, "click", CheckBox_OnClick, NULL, NULL);
}

static CheckBox_OnSetText(LCUI_Widget w, const char *text)
static void CheckBox_OnSetText(LCUI_Widget w, const char *text)
{
CheckBox data = Widget_GetData(w, self.prototype);

Expand Down
Loading

0 comments on commit b259bad

Please sign in to comment.