Skip to content

Latest commit

 

History

History
59 lines (49 loc) · 2.8 KB

uno-cupertino.md

File metadata and controls

59 lines (49 loc) · 2.8 KB

Uno.Cupertino

Uno Cupertino is an add-on package that lets you apply Human Interface Guideline styling to your application with a few lines of code. It features:

  • Color system for both Light and Dark themes
  • Styles for existing WinUI controls like Buttons, TextBox, etc.

Getting Started

  1. Add NuGet package Uno.Cupertino to each of project heads
  2. Add the following code inside App.xaml: 
    <Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <!-- Load WinUI resources -->
            <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />

            <CupertinoColors xmlns="using:Uno.Cupertino"  />
            <CupertinoResources xmlns="using:Uno.Cupertino" />

            <!-- Application's custom styles -->
            <!-- other ResourceDictionaries -->
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

For complete instructions on using Uno Cupertino in your projects, check out this walkthrough: How to use Uno.Cupertino.

Features

Styles for basic controls

Control Resource Key
Button CupertinoButtonStyle
CupertinoContainedButtonStyle
CalendarView CupertinoCalendarViewStyle
CalendarDatePicker CupertinoCalendarDatePickerStyle
CheckBox CupertinoCheckBoxStyle
ComboBox CupertinoComboBoxStyle
ComboBoxItem CupertinoComboBoxItemStyle
DatePicker CupertinoDatePickerStyle
DatePickerFlyoutPresenter CupertinoDatePickerFlyoutPresenterStyle
HyperlinkButton CupertinoHyperlinkButtonStyle
NumberBox CupertinoNumberBoxStyle
PasswordBox CupertinoPasswordBoxStyle
RadioButton CupertinoRadioButtonStyle
Slider CupertinoSliderStyle
TextBlock CupertinoBaseTextBlockStyle
CupertinoLargeTitle
CupertinoPrimaryTitle
CupertinoSecondaryTitle
CupertinoTertiaryTitle
CupertinoHeadline
CupertinoBody
CupertinoCallout
CupertinoSubhead
CupertinoFootnote
CupertinoPrimaryCaption
CupertinoSecondaryCaption
TextBox CupertinoTextBoxStyle
ToggleSwitch CupertinoToggleSwitchStyle
winui:ProgressBar CupertinoProgressBarStyle
winui:ProgressRing CupertinoProgressRingStyle

Customizable Color Theme

The colors used in the Cupertino styles are part of the color palette system, which can be customized to suit the theme of your application. Since this is decoupled from the styles, the application theme can be changed, without having to make a copy of every style and edit each of them.

Additional Resources