Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/main'
Browse files Browse the repository at this point in the history
  • Loading branch information
@kikipoulet
kikipoulet committed Sep 9, 2024
2 parents 4be2c81 + 4fa6c52 commit c27ea3e
Show file tree
Hide file tree
Showing 18 changed files with 414 additions and 117 deletions.
82 changes: 50 additions & 32 deletions SukiUI/Controls/SukiWindow.axaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,14 +22,15 @@
<ItemsControl ItemsSource="{Binding Hosts, RelativeSource={RelativeSource AncestorType={x:Type suki:SukiWindow}}}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Panel/>
<Panel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</VisualLayerManager.ChromeOverlayLayer>
<Panel x:Name="PART_Root">
<!-- Margin -100 is there to exclude the unwanted bright corners -->
<suki:SukiBackground Name="PART_Background" Margin="-150"
<!-- Margin -100 is there to exclude the unwanted bright corners -->
<suki:SukiBackground Name="PART_Background"
Margin="-150"
AnimationEnabled="{TemplateBinding BackgroundAnimationEnabled}"
ShaderCode="{TemplateBinding BackgroundShaderCode}"
ShaderFile="{TemplateBinding BackgroundShaderFile}"
Expand Down Expand Up @@ -133,36 +134,53 @@
<Style Selector="^[WindowState=Normal] /template/ PathIcon#MaximizeIcon">
<Setter Property="Data" Value="{x:Static icons:Icons.WindowMaximize}" />
</Style>

<Style Selector="^[IsTitleBarVisible=True] /template/ LayoutTransformControl#PART_LayoutTransform">
<Style.Animations>
<Animation Easing="{StaticResource MenuEasing}"
FillMode="Forward"
Duration="{StaticResource MediumAnimationDuration}">
<KeyFrame Cue="0%">
<Setter Property="ScaleTransform.ScaleY" Value="0" />
<Setter Property="IsVisible" Value="True" />
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="ScaleTransform.ScaleY" Value="1" />
</KeyFrame>
</Animation>
</Style.Animations>
<Style Selector="^[IsTitleBarVisible=True]">
<Style Selector="^[TitleBarAnimationEnabled=True]">
<Style Selector="^ /template/ LayoutTransformControl#PART_LayoutTransform">
<Style.Animations>
<Animation Easing="{StaticResource MenuEasing}"
FillMode="Forward"
Duration="{StaticResource MediumAnimationDuration}">
<KeyFrame Cue="0%">
<Setter Property="ScaleTransform.ScaleY" Value="0" />
<Setter Property="IsVisible" Value="True" />
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="ScaleTransform.ScaleY" Value="1" />
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
</Style>
<Style Selector="^[TitleBarAnimationEnabled=False]">
<Style Selector="^ /template/ LayoutTransformControl#PART_LayoutTransform">
<Setter Property="IsVisible" Value="True" />
</Style>
</Style>
</Style>
<Style Selector="^[IsTitleBarVisible=False] /template/ LayoutTransformControl#PART_LayoutTransform">
<Style.Animations>
<Animation Easing="{StaticResource MenuEasing}"
FillMode="Forward"
Duration="{StaticResource MediumAnimationDuration}">
<KeyFrame Cue="0%">
<Setter Property="ScaleTransform.ScaleY" Value="1" />
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="ScaleTransform.ScaleY" Value="0" />
<Setter Property="IsVisible" Value="False" />
</KeyFrame>
</Animation>
</Style.Animations>
<Style Selector="^[IsTitleBarVisible=False]">
<Style Selector="^[TitleBarAnimationEnabled=True]">
<Style Selector="^ /template/ LayoutTransformControl#PART_LayoutTransform">
<Style.Animations>
<Animation Easing="{StaticResource MenuEasing}"
FillMode="Forward"
Duration="{StaticResource MediumAnimationDuration}">
<KeyFrame Cue="0%">
<Setter Property="ScaleTransform.ScaleY" Value="1" />
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="ScaleTransform.ScaleY" Value="0" />
<Setter Property="IsVisible" Value="False" />
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
</Style>
<Style Selector="^[TitleBarAnimationEnabled=False]">
<Style Selector="^ /template/ LayoutTransformControl#PART_LayoutTransform">
<Setter Property="IsVisible" Value="False" />
</Style>
</Style>
</Style>
</ControlTheme>
<ControlTheme x:Key="{x:Type suki:SukiWindow}"
Expand Down
9 changes: 9 additions & 0 deletions SukiUI/Controls/SukiWindow.axaml.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,15 @@ public bool IsTitleBarVisible
set => SetValue(IsTitleBarVisibleProperty, value);
}

public static readonly StyledProperty<bool> TitleBarAnimationEnabledProperty =
AvaloniaProperty.Register<SukiWindow, bool>(nameof(TitleBarAnimationEnabled), defaultValue: true);

public bool TitleBarAnimationEnabled
{
get => GetValue(TitleBarAnimationEnabledProperty);
set => SetValue(TitleBarAnimationEnabledProperty, value);
}

public static readonly StyledProperty<bool> IsMenuVisibleProperty =
AvaloniaProperty.Register<SukiWindow, bool>(nameof(IsMenuVisible), defaultValue: false);

Expand Down
85 changes: 72 additions & 13 deletions docs/docs/documentation/controls/inputs/button.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,34 +2,93 @@

SukiUI has a handful of button styles, available in both the standard primary color, but also in the theme's accent color.

## Show
<br/>

<img src="/controls/inputs/button.webp" />
## Styles

- Busy
### Standard

<img src="/controls/inputs/button-busy.gif" height="300px" width="300px"/>
<img src="https://sleekshot.app/api/download/wWleWLZYWqR6" />

```xml
<Button Content="Button" ></Button>
```

### Flat

## Example
<img src="https://sleekshot.app/api/download/tYN4eE9SLoot" />

```xml
<Button>
<!-- Content -->
</Button>
<Button Content="Button" Classes="Flat" ></Button>
```

### Busy
### Rounded

<img src="https://sleekshot.app/api/download/zKfpsqmZzaHV" />

```xml
<Button Content="Button" Classes="Flat Rounded" ></Button>
```

### Outlined

<img src="https://sleekshot.app/api/download/uVA8CTxZ989L" />

```xml
<Button Content="Button" Classes="Outlined" ></Button>
```

### Basic

<img src="https://sleekshot.app/api/download/KTKtsjlVKsth" />

```xml
<Button Content="Button" Classes="Basic" ></Button>
```


### Flat Accent

<img src="https://sleekshot.app/api/download/vGFvTPZG1E8i" />

```xml
<Button Content="Button" Classes="Flat Accent" ></Button>
```

### Large

<img src="https://sleekshot.app/api/download/LiWhO4edwZi3" />

```xml
<Button Content="Button" Classes="Flat Large" ></Button>
```


<br/>

## Busy/Loading Button

<img src="/controls/inputs/button-busy.gif" height="300px" width="300px"/>

### Xaml

```xml
...
xmlns:theme="clr-namespace:SukiUI.Theme;assembly=SukiUI"
...

<Button theme:ButtonExtensions.ShowProgress="true">
<!-- Content -->
</Button>
<Button theme:ButtonExtensions.ShowProgress="true"></Button>
```

### C#

```Csharp
MyButton.ShowProgress();

MyButton.HideProgress();
```


## See Also

[Demo: SukiUI.Demo/Features/ControlsLibrary/ButtonsView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/ControlsLibrary/ButtonsView.axaml)
[Demo: SukiUI.Demo/Features/ControlsLibrary/ButtonsView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/ControlsLibrary/ButtonsView.axaml)
31 changes: 24 additions & 7 deletions docs/docs/documentation/controls/inputs/numericupdown.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,35 @@

A control for numeric input.

## Show
### Simple

<img src="/controls/inputs/numericupdown.gif"/>
<img src="https://sleekshot.app/api/download/nzfzrV8DgYEh"/>

## Example

```xml
<NumericUpDown theme:NumericUpDownExtensions.Unit="inch"
ShowButtonSpinner="False"
Value="10" />
<NumericUpDown Value="10" />
```

### Extension

<img src="https://sleekshot.app/api/download/qeEBVOXYPPC2"/>


```xml
<NumericUpDown theme:NumericUpDownExtensions.Unit="inch" Value="10" />
```

### No Spinner

<img src="https://sleekshot.app/api/download/4a9VFYrRaGb2"/>


```xml
<NumericUpDown theme:NumericUpDownExtensions.Unit="inch" ShowButtonSpinner="False" Value="10" />
```



## See Also

[Demo: SukiUI.Demo/Features/ControlsLibrary/MiscView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/ControlsLibrary/MiscView.axaml)
[Demo: SukiUI.Demo/Features/ControlsLibrary/MiscView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/ControlsLibrary/MiscView.axaml)
5 changes: 3 additions & 2 deletions docs/docs/documentation/controls/inputs/slider.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@ A control for displaying current value and intervals in range.

## Show

<img src="/controls/inputs/slider.gif"/>
![sliid](https://github.com/user-attachments/assets/80afe350-0032-41a8-b81c-5ff7acddf1e2)


## Example

Expand All @@ -18,4 +19,4 @@ A control for displaying current value and intervals in range.

## See Also

[Demo: SukiUI.Demo/Features/ControlsLibrary/ProgressView.axaml](https://github.com/kikipoulet/SukiUI/blob/cc73e0ddc894cc6b0ae3e73d44eb19e4d3328043/SukiUI.Demo/Features/ControlsLibrary/ProgressView.axaml#L45C16-L45C17)
[Demo: SukiUI.Demo/Features/ControlsLibrary/ProgressView.axaml](https://github.com/kikipoulet/SukiUI/blob/cc73e0ddc894cc6b0ae3e73d44eb19e4d3328043/SukiUI.Demo/Features/ControlsLibrary/ProgressView.axaml#L45C16-L45C17)
36 changes: 31 additions & 5 deletions docs/docs/documentation/controls/inputs/textbox.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,42 @@

A control used for collecting user provided information.

## Show
### Simple

<img src="/controls/inputs/textbox.gif"/>
<img src="https://sleekshot.app/api/download/8nnHYLrgchCe"/>

## Example

```xml
<TextBox theme:TextBoxExtensions.Prefix="Username" Watermark="John" />
<TextBox Text="Hello" />
```

### Clear Button

<img src="https://sleekshot.app/api/download/tNkEf1yb0lml"/>


```xml
<TextBox theme:TextBoxExtensions.AddDeleteButton="True" Text="Hello" />
```

### Prefix

<img src="https://sleekshot.app/api/download/354ntrKtfvXo"/>


```xml
<TextBox theme:TextBoxExtensions.Prefix="https://" Text="www.google.com" />
```

### Watermark

<img src="https://sleekshot.app/api/download/Y3odALgSfPCT"/>


```xml
<TextBox Watermark="Watermark" Text="" />
```

## See Also

[Demo: SukiUI.Demo/Features/Dashboard/DashboardView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/Dashboard/DashboardView.axaml)
[Demo: SukiUI.Demo/Features/Dashboard/DashboardView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/Dashboard/DashboardView.axaml)
7 changes: 3 additions & 4 deletions docs/docs/documentation/controls/inputs/toggleswitch.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,15 @@ Switching between two states.

## Show

<img src="/controls/inputs/toggleswitch.gif" height="300px" width="300px"/>
![tgs](https://github.com/user-attachments/assets/9fe52016-a002-4b4d-ad98-a3e2157a498c)


## Example

```xml
<ToggleSwitch IsChecked="True" />

<ToggleSwitch OffContent="Switch Off." OnContent="Switch On." />
```

## See Also

[Demo: SukiUI.Demo/Features/ControlsLibrary/TogglesView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/ControlsLibrary/TogglesView.axaml)
[Demo: SukiUI.Demo/Features/ControlsLibrary/TogglesView.axaml](https://github.com/kikipoulet/SukiUI/blob/main/SukiUI.Demo/Features/ControlsLibrary/TogglesView.axaml)
21 changes: 21 additions & 0 deletions docs/docs/documentation/controls/layout/dock.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# Dock



As Docking controls are often asked by community, we decided to make a theme for the [Dock](https://github.com/wieslawsoltes/Dock) library.


![dock](https://github.com/user-attachments/assets/ef7ec55f-f13c-4214-b5ce-ad5ef3042868)


## Install SukiUI Nuget Package

![{F7E52AB9-7A5A-4007-9CBC-8258079C1F78}](https://github.com/user-attachments/assets/4fac741b-55da-41f8-90cf-bd47809f8e9f)

## Reference it in your App.axaml

```xml
<StyleInclude Source="avares://SukiUI.Dock/Index.axaml" />
```

You can now install and use the Dock library with SukiUI !
Loading

0 comments on commit c27ea3e

Please sign in to comment.