XAML構築時に利用したやつ簡易メモ


XAMLでWPF用のUIを構築する際のメモ
検索して探した結果などのコピペ的まとめもありまするメモ

APPのウィンドウ枠を非表示にして透明化

APPを閉じたりするバーなどを非表示にしてAPPの枠がない状態へ設定

WindowStyle : None
AllowTransparency : true

カスタムコントロールからAPPの閉じるなどのバーを自作

自作したAPPヘッダーでAPP拡大や移動など制御したい
カスタムコントロールにするとWindowがないから動かなかったので対処をメモ

public static class WindowUtil
{
  public static Window GetWindow(this DependencyObject element)
  {
    return Window.GetWindow(element);
  }
}
private void OnClose(object sender, RoutedEventArgs e)
{
  var window = ((FrameworkElement)sender).GetWindow();
  window.Close();
}

private void OnMove(object sender, MouseButtonEventArgs e)
{
  var window = ((FrameworkElement)sender).GetWindow();
  window.DragMove();
}

private void OnMaximam(object sender, RoutedEventArgs e)
{
  var window = ((FrameworkElement)sender).GetWindow();
  window.WindowState = window.WindowState != WindowState.Maximized ? WindowState.Maximized : WindowState.Normal;
}

private void OnMimimam(object sender, RoutedEventArgs e)
{
  var window = ((FrameworkElement)sender).GetWindow();
  window.WindowState = window.WindowState != WindowState.Minimized ? WindowState.Minimized : WindowState.Normal;
}

ボタンの見た目を変更

カンバスにSVGみたいな言語で図形が描画できる
このへんは便利と感じる、SVGと同じことできる感じ

<Style TargetType="Button">
  <!--Set to true to not get any properties from the themes.-->
  <Setter Property="OverridesDefaultStyle" Value="True"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">
        <Grid>
          <Ellipse Fill="{TemplateBinding Background}"/>
          <ContentPresenter HorizontalAlignment="Center"
                            VerticalAlignment="Center"/>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

カスタムコントロールのXAMLでへ値をプロパティ譲渡

public class ClockControl: UserControl
    {
        public static readonly DependencyProperty CityProperty = DependencyProperty.Register
            (
                 "City", 
                 typeof(string), 
                 typeof(ClockControl), 
                 new PropertyMetadata(string.Empty)
            );

        public string City
        {
            get { return (string)GetValue(CityProperty); }
            set { SetValue(CityProperty, value); }
        }

        public ClockControl()
        {
            InitializeComponent();

        }
}

グリッドレイアウトでレスポンシブ

*がついているやつは伸びる感じします

<Grid>
  <Grid.RowDefinitions>
      <RowDefinition Height="1080*"/>
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
      <ColumnDefinition Width="240*"/>
      <ColumnDefinition Width="240*"/>
      <ColumnDefinition Width="240*"/>
  </Grid.ColumnDefinitions>
  <StackPanel Grid.Column="0"></StackPanel>
  <StackPanel Grid.Column="1"></StackPanel>
  <StackPanel Grid.Column="3"></StackPanel>
</Grid>

参考サイト

XAML でのレスポンシブ レイアウト
https://docs.microsoft.com/ja-jp/windows/uwp/design/layout/layouts-with-xaml

xamlからパラメーターをどのように渡しますか?
https://www.it-swarm.dev/ja/c%23/xaml%E3%81%8B%E3%82%89%E3%83%91%E3%83%A9%E3%83%A1%E3%83%BC%E3%82%BF%E3%83%BC%E3%82%92%E3%81%A9%E3%81%AE%E3%82%88%E3%81%86%E3%81%AB%E6%B8%A1%E3%81%97%E3%81%BE%E3%81%99%E3%81%8B%EF%BC%9F/972009094/

ControlTemplate クラス
https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.controls.controltemplate?view=netcore-3.1

How to: Draw an Ellipse or a Circle
https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/graphics-multimedia/how-to-draw-an-ellipse-or-a-circle?view=netframeworkdesktop-4.8

ウィンドウ枠のない WPF アプリを作成する
https://sakapon.wordpress.com/2015/03/01/wpf-borderless/

【WPF】包含するコンテンツからWindowを取得するには?
http://pro.art55.jp/?eid=1070343