XAML でボタンを円として再描画する方法

XAML でボタンを円として再描画する方法
XAML レイアウトを使用する場合、インターフェイスを Metro 風にするために、一部のボタンではデフォルトの四角形ではなく円を使用する必要がある場合があります。次のボタン スタイルはこの問題を解決し、必要に応じて変更できます。もちろん、Bland を使い慣れているなら、それを直接使って必要なスタイルを描画することもできますが、コードを貼り付けたほうが早いでしょうか?

コードをコピー
コードは次のとおりです。

<Style x:Key="btnNext" TargetType="ボタン">
<Setter プロパティ="テンプレート">
<Setter.値>
<コントロールテンプレート ターゲットタイプ="ボタン">
<グリッド>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="共通状態">
<VisualState x:Name="押された">
<ストーリーボード>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="rectangle">
<DiscreteObjectKeyFrame キータイム="0">
<離散オブジェクトキーフレーム.値>
<厚さ>-3</厚さ>
</DiscreteObjectKeyFrame.Value>
</離散オブジェクトキーフレーム>
</オブジェクトアニメーションキーフレームを使用>
</ストーリーボード>
</ビジュアル状態>
<VisualState x:Name="Normal"/>
<VisualState x:Name="無効"/>
<VisualState x:Name="マウスオーバー"/>
</ビジュアル状態グループ>
<VisualStateGroup x:Name="フォーカス状態">
<VisualState x:Name="フォーカス"/>
</ビジュアル状態グループ>
</VisualStateManager.VisualStateGroups>
<Rectangle x:Name="rectangle" RadiusY="25" RadiusX="25" Stroke="Blue" StrokeThickness="4">
</長方形>
<ContentPresenter Horizo​​ntalAlignment="{TemplateBinding Horizo​​ntalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</グリッド>
</コントロールテンプレート>
</Setter.Value>
</セッター>
<Setter プロパティ="マージン" 値="5"/>
<Setter プロパティ="幅" 値="50"/>
<Setter プロパティ="高さ" 値="50"/>
<Setter プロパティ="FontSize" 値="120"/>
<Setter プロパティ="前景" 値="白"/>
</スタイル>

<<:  VUEのデータプロキシとイベントの詳細な説明

>>:  CSSの優先度を理解する2つの方法

推薦する

MySQL 5.7.17 圧縮バージョンのインストールノート

この記事では、参考までにMySQL 5.7.17圧縮版のインストール手順を紹介します。具体的な内容は...

DockerでRedisを使用するための詳細な手順

1. はじめにこの記事では、Docker を使用して Redis を探索する方法を説明します。 Do...

Linux環境でグラフデータベースneo4jを構築する方法の説明

Neo4j (Nosql の 1 つ) は、高性能なグラフ データベース (分散をサポートしていませ...

ウェブページのコピー防止機能の実装方法(クラッキング手法付き)

ソース ファイルを右クリックすると、次のコードが見つかります。 1. CSSを使用してFirefox...

CSS で実装された円形のプログレスバー

成果を達成する 実装コードhtml <div class="wrap"&g...

Docker 経由で wsl の tar ファイルを作成する方法

最近VScodeのリモート開発機能をいじっています。Dockerのコンテナに接続できるほか、WSLに...

nginxのインストールと設定の詳細なプロセス記録

目次1 nginxの紹介1 nginxとは何か2 つのアプリケーション シナリオ2 nginxのイン...

Linux で SVN サーバーをインストールする方法

1. Yumのインストール yum でサブバージョンをインストール 2. 構成1. 倉庫を作る/ho...

Webデザイン: タイトルが完全に表示できない場合

<br />今日、新しくなった ChinaUI.com の Web サイトを見たのですが...

MySQLトリガーの使用

トリガーにより、ステートメントの実行前または実行後に他の SQL コードを実行できます。トリガーは、...

セマンティックウェブページ XHTML セマンティックマークアップ

構造とプレゼンテーションを分離するもう 1 つの重要な側面は、セマンティック マークアップを使用して...

写真のプレビューとアップロード機能を実現するhtml+css+js

はじめに: Web ページを作成するときに、画像をアップロードする必要がある場合がよくあります。画像...

Centos7 で yum を使用して Mysql5.7.19 をインストールする詳細な手順

Centos7 の yum ソースには、mysql の代わりに mariaDB が使用されているため...

mysqlサーバーは--skip-grant-tablesオプションで実行されています

MySQLサーバーは--skip-grant-tablesオプションで実行されているため、このステー...

Centos7のシステム言語を簡体字中国語に変更する方法

例示するシステムを自分でインストールする場合は、通常、システム言語をカスタマイズできます。ただし、ク...