Arion.Style.Controls 0.0.1

Suggested Alternatives

Arion.Style

There is a newer version of this package available.
See the version list below for details.
dotnet add package Arion.Style.Controls --version 0.0.1                
NuGet\Install-Package Arion.Style.Controls -Version 0.0.1                
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="Arion.Style.Controls" Version="0.0.1" />                
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add Arion.Style.Controls --version 0.0.1                
#r "nuget: Arion.Style.Controls, 0.0.1"                
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install Arion.Style.Controls as a Cake Addin
#addin nuget:?package=Arion.Style.Controls&version=0.0.1

// Install Arion.Style.Controls as a Cake Tool
#tool nuget:?package=Arion.Style.Controls&version=0.0.1                

Arion style

nuget

Библиотека компонентов и стилей


Подключение

В менеджере пакетов Nuget находите пакет Arion.Style и устанавливаете его

Arion.Style в менеджере пакетов nuget

В документ App.xaml добавляете словарь

<ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="/Arion.Theme;component/ArionUiTheme.xaml" />
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

Использование конкретных элементов прописано в самом элементе


Оглавление

  1. Кнопки
  2. Текстовые поля
  3. Чек бокс
  4. Переключатель
  5. Радио кнопки
  6. Свитчер
  7. Слайдер
  8. Списки
  9. Табы
  10. Всплывающие подсказки
  11. Цвета
  12. Иконки

Кнопка

Обычные кнопки

Есть несколько типов стилей кнопок Filled, Outline, Text

Filled - Закрашенные без рамок Outline - Белые кнопки с рамками Text - Белые кнопки без рамок, на белом фоне похожи на простой текст, пока не наведешь

Так же есть 3 размера этих кнопок Large(Lg), Medium(Md) и Small(Sm)

Для использования стилей пишете сначала тип кнопки, потом её размер в сокращенном варианте

Доступные стили для версии 0.1.3

Filled Outline Text
Large (Lg) Кнопка со стилем FilledLg Кнопка со стилем OutlineLg Кнопка со стилем TextLg
Medium (Md) Кнопка со стилем FilledMd Кнопка со стилем OutlineMd Кнопка со стилем TextMd
Small (Sm) Кнопка со стилем FilledSm Кнопка со стилем OutlineMd Кнопка со стилем TextSm

FilledLg, FilledMd, FilledSm, OutlineLg, OutlineMd, OutlineSm, TextLg, TextMd, TextSm.


Текстовое поле

Стиль текстового поля задан по умолчанию, поэтому какой то определенный стиль применять не требуется.

Элемент TextBox

Так же есть текстовое поле с элементом предварительного текста TextInput. В этом элементе можно указать свойство Placeholder, которое отобразит текст, который будет пропадать при вводе.

Элемент TextInput Элемент TextInput с введеном текстом

xmlns:controls="clr-namespace:Arion.Theme.Controls;assembly=Arion.Theme"

<controls:TextInput Placeholder="Placeholder" />


Чек бокс

Стиль данного элемента также установлен по умолчанию, и имеет разное отображение на 3 состояния Checked, Unchecked, Null

Чек бокс


Переключатель


Радио кнопки

Стиль установлен по умолчанию


Свитчер

Переключатели или же свитчеры, стиль для Радио кнопок.

Имеют 3 типа по отображению

Switcher
First SwitcherFirst
Middle SwitcherMiddle
Last SwitcherLast

SwitcherFirst, SwitcherMiddle, SwitcherLast


Слайдер

Slider


Табы

Tabs


Списки


Всплывающие подсказки

ToolTip


Цвета

Pr R G Y P T
50 Pr50 Pr50 Pr50 Pr50 Pr50 Pr50
100 Pr100 Pr100 Pr100 Pr100 Pr100 Pr100
200 Pr200 Pr200 Pr200 Pr200 Pr200 Pr200
300 Pr300 Pr300 Pr300 Pr300 Pr300 Pr300
400 Pr400 Pr400 Pr400 Pr400 Pr400 Pr400
500 Pr500 Pr500 Pr500 Pr500 Pr500 Pr500
600 Pr600 Pr600 Pr600 Pr600 Pr600 Pr600
700 Pr700 Pr700 Pr700 Pr700 Pr700 Pr700
800 Pr800 Pr800 Pr800 Pr800 Pr800 Pr800
900 Pr900 Pr900 Pr900 Pr900 Pr900 Pr900

Pr50, Pr100, Pr200, Pr300, Pr400, Pr500, Pr600, Pr700, Pr800, Pr900 и так далее


Тени

El1 El2 El3 El4 El5 El6
El1 El2 El3 El4 El5 El6

Иконки

Для того что бы использовать иконки требуется так же подключить директорию контролов из библиотеки

xmlns:controls="clr-namespace:Arion.Theme.Controls;assembly=Arion.Theme"

После чего появится возможность использовать элемент Icon

<controls:Icon Kind="" Width="" Height="" Fill=""/>

В данном элементе есть 4 стандартных свойства которые требуется задать

  • Kind - Иконка
  • Width - Ширина
  • Height - Высота
  • Fill - Заливка цветом

Пак всех иконок будет добавлен позднее

Product Compatible and additional computed target framework versions.
.NET Framework net461 is compatible.  net462 was computed.  net463 was computed.  net47 was computed.  net471 was computed.  net472 was computed.  net48 is compatible.  net481 was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.