Styles.xaml 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395
  1. <Styles
  2. xmlns="https://github.com/avaloniaui"
  3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4. xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia">
  5. <Design.PreviewWith>
  6. <Border Height="2000"
  7. Padding="20">
  8. <StackPanel Spacing="5">
  9. <TextBlock Text="Code Font Family" />
  10. <Grid RowDefinitions="*,Auto">
  11. <Menu Grid.Row="1"
  12. Width="100">
  13. <MenuItem Header="File">
  14. <MenuItem Header="Test 1" />
  15. <MenuItem Header="Test 2" />
  16. <MenuItem Header="Test 3">
  17. <MenuItem.Icon>
  18. <CheckBox Margin="0" />
  19. </MenuItem.Icon>
  20. </MenuItem>
  21. </MenuItem>
  22. </Menu>
  23. <StackPanel Orientation="Horizontal">
  24. <ToggleButton
  25. Name="btnAdd"
  26. Height="28"
  27. HorizontalAlignment="Right"
  28. Content="Addy" />
  29. <Button
  30. Name="btnRem"
  31. HorizontalAlignment="Right"
  32. Content="Add" />
  33. <TextBox
  34. Width="100"
  35. VerticalAlignment="Center"
  36. Text="Rrrrr"
  37. UseFloatingWatermark="True"
  38. Watermark="Hello" />
  39. <CheckBox>Test Check</CheckBox>
  40. </StackPanel>
  41. </Grid>
  42. <ui:NumberBox Value="1" />
  43. </StackPanel>
  44. </Border>
  45. </Design.PreviewWith>
  46. <Style Selector="Border.small">
  47. <Setter Property="Width"
  48. Value="100" />
  49. </Style>
  50. <Style Selector="Border.normal">
  51. <Setter Property="Width"
  52. Value="130" />
  53. </Style>
  54. <Style Selector="Border.large">
  55. <Setter Property="Width"
  56. Value="160" />
  57. </Style>
  58. <Style Selector="Border.huge">
  59. <Setter Property="Width"
  60. Value="200" />
  61. </Style>
  62. <Style Selector="Border.settings">
  63. <Setter Property="Background"
  64. Value="{DynamicResource ThemeDarkColor}" />
  65. <Setter Property="BorderBrush"
  66. Value="{DynamicResource MenuFlyoutPresenterBorderColor}" />
  67. <Setter Property="BorderThickness"
  68. Value="1" />
  69. <Setter Property="CornerRadius"
  70. Value="5" />
  71. </Style>
  72. <Style Selector="Image.small">
  73. <Setter Property="Width"
  74. Value="50" />
  75. </Style>
  76. <Style Selector="Image.normal">
  77. <Setter Property="Width"
  78. Value="80" />
  79. </Style>
  80. <Style Selector="Image.large">
  81. <Setter Property="Width"
  82. Value="100" />
  83. </Style>
  84. <Style Selector="Image.huge">
  85. <Setter Property="Width"
  86. Value="120" />
  87. </Style>
  88. <Style Selector="#TitleBarHost &gt; Image">
  89. <Setter Property="Margin"
  90. Value="10" />
  91. </Style>
  92. <Style Selector="#TitleBarHost &gt; Label">
  93. <Setter Property="Margin"
  94. Value="5" />
  95. <Setter Property="FontSize"
  96. Value="14" />
  97. </Style>
  98. <Style Selector="Button.SystemCaption">
  99. <Setter Property="MinWidth"
  100. Value="10" />
  101. </Style>
  102. <Style Selector="DataGridColumnHeader">
  103. <Setter Property="Foreground"
  104. Value="{DynamicResource ThemeForegroundBrush}" />
  105. <Setter Property="HorizontalContentAlignment"
  106. Value="Center" />
  107. <Setter Property="BorderThickness"
  108. Value="1" />
  109. <Setter Property="VerticalContentAlignment"
  110. Value="Center" />
  111. <Setter Property="SeparatorBrush"
  112. Value="{DynamicResource ThemeControlBorderColor}" />
  113. <Setter Property="Padding"
  114. Value="5" />
  115. <Setter Property="Background"
  116. Value="{DynamicResource ThemeContentBackgroundColor}" />
  117. <Setter Property="Template">
  118. <ControlTemplate>
  119. <Grid Background="{TemplateBinding Background}"
  120. ColumnDefinitions="*,Auto">
  121. <Grid
  122. Margin="{TemplateBinding Padding}"
  123. HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
  124. VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
  125. ColumnDefinitions="*,Auto">
  126. <ContentPresenter Content="{TemplateBinding Content}" />
  127. <Path
  128. Name="SortIcon"
  129. Grid.Column="1"
  130. Width="8"
  131. Margin="4,0,0,0"
  132. HorizontalAlignment="Left"
  133. VerticalAlignment="Center"
  134. Data="F1 M -5.215,6.099L 5.215,6.099L 0,0L -5.215,6.099 Z "
  135. Fill="{TemplateBinding Foreground}"
  136. Stretch="Uniform" />
  137. </Grid>
  138. <Rectangle
  139. Name="VerticalSeparator"
  140. Grid.Column="1"
  141. Width="1"
  142. VerticalAlignment="Stretch"
  143. Fill="{TemplateBinding SeparatorBrush}"
  144. IsVisible="{TemplateBinding AreSeparatorsVisible}" />
  145. </Grid>
  146. </ControlTemplate>
  147. </Setter>
  148. </Style>
  149. <Style Selector="DataGrid">
  150. <Setter Property="RowBackground"
  151. Value="{DynamicResource ThemeAccentBrush4}" />
  152. <Setter Property="Background"
  153. Value="{DynamicResource ThemeBackgroundBrush}" />
  154. <Setter Property="BorderBrush"
  155. Value="{DynamicResource ThemeBorderLowColor}" />
  156. <Setter Property="BorderThickness"
  157. Value="{DynamicResource ThemeBorderThickness}" />
  158. </Style>
  159. <Style Selector="DataGridRow:selected:focus /template/ Rectangle#BackgroundRectangle">
  160. <Setter Property="Fill"
  161. Value="{DynamicResource SystemAccentColor}" />
  162. <Setter Property="Opacity"
  163. Value="{DynamicResource DataGridRowSelectedBackgroundOpacity}" />
  164. </Style>
  165. <Style Selector="DataGridRow:pointerover /template/ Rectangle#BackgroundRectangle">
  166. <Setter Property="Fill"
  167. Value="{DynamicResource SystemListLowColor}" />
  168. </Style>
  169. <Style Selector="DataGridRow:selected /template/ Rectangle#BackgroundRectangle">
  170. <Setter Property="Fill"
  171. Value="{DynamicResource SystemAccentColor}" />
  172. <Setter Property="Opacity"
  173. Value="{DynamicResource DataGridRowSelectedUnfocusedBackgroundOpacity}" />
  174. </Style>
  175. <Style Selector="DataGridRow:selected:pointerover /template/ Rectangle#BackgroundRectangle">
  176. <Setter Property="Fill"
  177. Value="{DynamicResource SystemAccentColor}" />
  178. <Setter Property="Opacity"
  179. Value="{DynamicResource DataGridRowSelectedHoveredUnfocusedBackgroundOpacity}" />
  180. </Style>
  181. <Style Selector="DataGridRow:selected:pointerover:focus /template/ Rectangle#BackgroundRectangle">
  182. <Setter Property="Fill"
  183. Value="{DynamicResource SystemAccentColor}" />
  184. <Setter Property="Opacity"
  185. Value="{DynamicResource DataGridRowSelectedHoveredBackgroundOpacity}" />
  186. </Style>
  187. <Style Selector="DataGridCell">
  188. <Setter Property="HorizontalAlignment"
  189. Value="Center" />
  190. <Setter Property="HorizontalContentAlignment"
  191. Value="Center" />
  192. </Style>
  193. <Style Selector="DataGridCell.Left">
  194. <Setter Property="HorizontalAlignment"
  195. Value="Left" />
  196. </Style>
  197. <Style Selector="CheckBox">
  198. <Setter Property="BorderThickness"
  199. Value="1" />
  200. </Style>
  201. <Style Selector="MenuItem">
  202. <Setter Property="Height"
  203. Value="{DynamicResource MenuItemHeight}" />
  204. <Setter Property="Padding"
  205. Value="{DynamicResource MenuItemPadding}" />
  206. <Setter Property="FontSize"
  207. Value="12" />
  208. </Style>
  209. <Style Selector="MenuItem:selected /template/ Border#root">
  210. <Setter Property="Background"
  211. Value="{DynamicResource ThemeControlBorderColor}" />
  212. <Setter Property="BorderBrush"
  213. Value="{DynamicResource ThemeControlBorderColor}" />
  214. </Style>
  215. <Style Selector="TabItem > ScrollViewer">
  216. <Setter Property="Background"
  217. Value="{DynamicResource ThemeBackgroundColor}" />
  218. <Setter Property="Margin"
  219. Value="0,-5,0,0" />
  220. </Style>
  221. <Style Selector="TabItem > ScrollViewer > Border">
  222. <Setter Property="BorderThickness"
  223. Value="0,1,0,0" />
  224. <Setter Property="Background"
  225. Value="{DynamicResource ThemeBackgroundColor}" />
  226. <Setter Property="BorderBrush"
  227. Value="{DynamicResource HighlightBrush}" />
  228. </Style>
  229. <Style Selector="Button">
  230. <Setter Property="MinWidth"
  231. Value="80" />
  232. </Style>
  233. <Style Selector="ProgressBar /template/ Border#ProgressBarTrack">
  234. <Setter Property="IsVisible"
  235. Value="False" />
  236. </Style>
  237. <Style Selector="ToggleButton">
  238. <Setter Property="Padding"
  239. Value="0,-5,0,0" />
  240. </Style>
  241. <Style Selector="TabItem">
  242. <Setter Property="FontSize"
  243. Value="14" />
  244. <Setter Property="BorderThickness"
  245. Value="0,0,1,0" />
  246. <Setter Property="BorderBrush"
  247. Value="{DynamicResource ThemeButtonForegroundColor}" />
  248. <Setter Property="Background"
  249. Value="{DynamicResource SystemAccentColorLight2}" />
  250. </Style>
  251. <Style Selector="TabItem:pointerover">
  252. <Setter Property="Foreground"
  253. Value="{DynamicResource ThemeButtonForegroundColor}" />
  254. </Style>
  255. <Style Selector="TabItem:selected">
  256. <Setter Property="Background"
  257. Value="{DynamicResource SystemAccentColorLight2}" />
  258. <Setter Property="Foreground"
  259. Value="{DynamicResource ThemeBackgroundColor}" />
  260. </Style>
  261. <Style Selector="TextBlock">
  262. <Setter Property="Margin"
  263. Value="{DynamicResource TextMargin}" />
  264. <Setter Property="FontSize"
  265. Value="{DynamicResource FontSize}" />
  266. <Setter Property="VerticalAlignment"
  267. Value="Center" />
  268. <Setter Property="TextWrapping"
  269. Value="WrapWithOverflow" />
  270. </Style>
  271. <Style Selector="TextBlock.h1">
  272. <Setter Property="Margin"
  273. Value="{DynamicResource TextMargin}" />
  274. <Setter Property="VerticalAlignment"
  275. Value="Center" />
  276. <Setter Property="FontWeight"
  277. Value="Bold" />
  278. <Setter Property="FontSize"
  279. Value="16" />
  280. <Setter Property="TextWrapping"
  281. Value="WrapWithOverflow" />
  282. </Style>
  283. <Style Selector="Separator">
  284. <Setter Property="Background"
  285. Value="{DynamicResource ThemeControlBorderColor}" />
  286. <Setter Property="Foreground"
  287. Value="{DynamicResource ThemeControlBorderColor}" />
  288. <Setter Property="MinHeight"
  289. Value="1" />
  290. </Style>
  291. <Style Selector=":is(Button).DateTimeFlyoutButtonStyle">
  292. <Setter Property="Background"
  293. Value="{DynamicResource SystemAccentColorLight2}" />
  294. <Setter Property="Foreground"
  295. Value="{DynamicResource ThemeBackgroundColor}" />
  296. </Style>
  297. <Style Selector="DatePickerPresenter">
  298. <Setter Property="BorderThickness"
  299. Value="1" />
  300. <Setter Property="BorderBrush"
  301. Value="{DynamicResource ThemeButtonForegroundColor}" />
  302. </Style>
  303. <Style Selector="DataGridCell">
  304. <Setter Property="FontSize"
  305. Value="14" />
  306. </Style>
  307. <Style Selector="CheckBox TextBlock">
  308. <Setter Property="Margin"
  309. Value="0,5,0,0" />
  310. </Style>
  311. <Style Selector="ContextMenu">
  312. <Setter Property="BorderBrush"
  313. Value="{DynamicResource MenuFlyoutPresenterBorderBrush}" />
  314. <Setter Property="BorderThickness"
  315. Value="{DynamicResource MenuFlyoutPresenterBorderThemeThickness}" />
  316. </Style>
  317. <Style Selector="TextBox">
  318. <Setter Property="VerticalContentAlignment"
  319. Value="Center" />
  320. </Style>
  321. <Style Selector="TextBox.NumberBoxTextBoxStyle">
  322. <Setter Property="Foreground"
  323. Value="{DynamicResource ThemeForegroundColor}" />
  324. </Style>
  325. <Style Selector="ListBox ListBoxItem">
  326. <Setter Property="Padding"
  327. Value="0" />
  328. <Setter Property="Margin"
  329. Value="0" />
  330. <Setter Property="CornerRadius"
  331. Value="5" />
  332. <Setter Property="Background"
  333. Value="{DynamicResource AppListBackgroundColor}" />
  334. <Setter Property="BorderThickness"
  335. Value="2"/>
  336. </Style>
  337. <Style Selector="ListBox ListBoxItem:selected /template/ ContentPresenter">
  338. <Setter Property="Background"
  339. Value="{DynamicResource AppListBackgroundColor}" />
  340. </Style>
  341. <Style Selector="ListBox">
  342. <Setter Property="Background"
  343. Value="{DynamicResource ThemeContentBackgroundColor}" />
  344. </Style>
  345. <Style Selector="FlyoutPresenter, ContextMenu, MenuFlyoutPresenter">
  346. <Setter Property="BorderBrush"
  347. Value="{DynamicResource MenuFlyoutPresenterBorderColor}" />
  348. </Style>
  349. <Style Selector="ListBox ListBoxItem:pointerover /template/ ContentPresenter">
  350. <Setter Property="Background"
  351. Value="{DynamicResource AppListHoverBackgroundColor}" />
  352. </Style>
  353. <Styles.Resources>
  354. <SolidColorBrush x:Key="ThemeAccentColorBrush"
  355. Color="{DynamicResource SystemAccentColor}" />
  356. <StaticResource x:Key="ListViewItemBackgroundSelected"
  357. ResourceKey="ThemeAccentColorBrush" />
  358. <StaticResource x:Key="ListViewItemBackgroundPressed"
  359. ResourceKey="SystemAccentColorDark1" />
  360. <StaticResource x:Key="ListViewItemBackgroundPointerOver"
  361. ResourceKey="SystemAccentColorDark2" />
  362. <StaticResource x:Key="ListViewItemBackgroundSelectedPressed"
  363. ResourceKey="ThemeAccentColorBrush" />
  364. <StaticResource x:Key="ListViewItemBackgroundSelectedPointerOver"
  365. ResourceKey="SystemAccentColorDark2" />
  366. <SolidColorBrush
  367. x:Key="DataGridGridLinesBrush"
  368. Opacity="0.4"
  369. Color="{DynamicResource SystemBaseMediumLowColor}" />
  370. <SolidColorBrush x:Key="DataGridSelectionBackgroundBrush"
  371. Color="{DynamicResource DataGridSelectionColor}" />
  372. <SolidColorBrush x:Key="SplitButtonBackgroundChecked"
  373. Color="#00E81123" />
  374. <SolidColorBrush x:Key="SplitButtonBackgroundCheckedPointerOver"
  375. Color="#00E81123" />
  376. <SolidColorBrush x:Key="SplitButtonBackgroundCheckedPressed"
  377. Color="#00E81123" />
  378. <SolidColorBrush x:Key="SplitButtonBackgroundCheckedDisabled"
  379. Color="#00E81123" />
  380. <Thickness x:Key="PageMargin">40 0 40 0</Thickness>
  381. <Thickness x:Key="Margin">0 5 0 5</Thickness>
  382. <Thickness x:Key="MenuItemPadding">5 0 5 0</Thickness>
  383. <x:Double x:Key="ScrollBarThickness">15</x:Double>
  384. <x:Double x:Key="FontSizeSmall">8</x:Double>
  385. <x:Double x:Key="FontSizeNormal">10</x:Double>
  386. <x:Double x:Key="FontSize">12</x:Double>
  387. <x:Double x:Key="FontSizeLarge">15</x:Double>
  388. <x:Double x:Key="ControlContentThemeFontSize">13</x:Double>
  389. <x:Double x:Key="MenuItemHeight">26</x:Double>
  390. <x:Double x:Key="TabItemMinHeight">28</x:Double>
  391. <x:Double x:Key="ContentDialogMaxWidth">600</x:Double>
  392. <x:Double x:Key="ContentDialogMaxHeight">756</x:Double>
  393. </Styles.Resources>
  394. </Styles>