WPF の Bootstrap っぽい テーマ

0 件のコメント

WPF の "Bootstrap" っぽい デザイン テーマ を作成しました。 コントロールだけ似せていては物足りなかったので、 メトロデザイン(フラットデザイン?)っぽい Window スタイル も作成しています。

※ まだ開発中なので足りない部分等あるかもしれません。その際はご意見いただけると嬉しいです。

Twining テーマ

ダウンロード
V0.0.2
旧バージョン
外部リンク

概要

簡単に Bootstrap ライク な フラットデザイン の WPFアプリケーション 作成ができます。 "Twining"テーマ を利用した時の外観イメージは以下のようなものになります。

コントロール類は Bootstrap に似たデザインを、ウィンドウは枠のないフラットなデザインになるようなテーマになります。

使い方(導入)

テーマのダウンロード

  1. 最新版を以下のページよりダウンロード

    GitHub - garafu / Twining : releases

プロジェクトの新規作成

  1. WPFアプリケーションを新規作成

  2. ダウンロードした dll を配置

    ダウンロードした Twining.dll は プロジェクト内の任意の位置へ配置します。 ここでは、"library" ディレクトリを作成してその配下へ配置しました。

  3. 参照設定に追加

    参照に追加する際は「参照(B)...」からプロジェクトに追加した Twining.dll を直接参照するようにします。 参照先のパスが該当DLLになっていることを確認します。

テーマの設定

  1. "App.xaml"に追加した ResourceDictionary を追加

    追加コード

    <Application x:Class="WpfApplication.App"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 StartupUri="Views/MainWindow.xaml">
        <Application.Resources>
            <ResourceDictionary Source="/Twining;component/Themes/Generic.xaml" />
        </Application.Resources>
    </Application>
    

    追加場所

  2. "MainWindow.xaml"に Style を適用

    追加コード

    <Window x:Class="WpfApplication.Views.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525"
            Style="{StaticResource wnd-metro}">
      ...
    </Window>
    

    追加場所

以上で導入作業は終わりです。 実行して動作確認を行ってみてください。 (きっと動くハズ!)

最後に… このブログに興味を持っていただけた方は、 ぜひ 「Facebookページ に いいね!」または 「Twitter の フォロー」 お願いします!!