Debug時とRelease時のXAML表示内容を切り替える方法
この記事はXAMLアドベントカレンダー 2016 2日目の記事です。
ちょっと予定を変更して、本日はXAMLの小ネタ。
XAML上で、以下のような表示切替をしてみます。
- Debug/Releaseモードに応じて表示内容を切り替える
- VSのデザイナ上での実行orアプリとしての実行に応じて、表示内容を切り替える
Debug時とRelease時のXAML表示内容を切り替える
やっていることは非常にシンプルです。
以下のようなstaticなプロパティを作り、Debug/Releaseビルドに応じて返す値を変えるだけです。
Misc.cs
namespace WpfApplication1 { public class Misc { /// <summary> /// DebugモードのみVisibleとなるプロパティ /// </summary> /// <remarks> /// コントロールのVisibilityプロパティに設定すると、 /// Debugビルド時のみ表示、という表示切替ができます。 /// </remarks> public static Visibility IsDebugVisible { #if DEBUG get { return Visibility.Visible; } #else get { return Visibility.Collapsed; } #endif } } }
そしてこのプロパティを、以下のようにVisibilityプロパティに設定します。
<Button Width="75" Margin="5" Content="Button2" Visibility="{x:Static local:Misc.IsDebugVisible}"/>
こうすると、簡単にDebugビルド時だけ表示するコントロールを作ることができます。
使用例
MainWindow.xaml
<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:WpfApplication1" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Title="MainWindow" Width="300" Height="200" mc:Ignorable="d"> <Grid> <StackPanel HorizontalAlignment="Left"> <Button Width="75" Margin="5" Content="Button1" /> <Button Width="75" Margin="5" Content="Button2" Visibility="{x:Static local:Misc.IsDebugVisible}"/> <Button Width="75" Margin="5" Content="Button3" /> </StackPanel> </Grid> </Window>
Debugビルド | Releaseビルド |
---|---|
注意点
この方法は、単純にVisbilityを切り替えてるだけです。
Snoopなどのツールを使うとコントロールの存在は見えますし、Visibilityも簡単に切り替えられます。
Releaseビルド時に本当に見えちゃまずいものは、ちゃんとXAML上から消しておいた方がよいでしょう。
デザインモード時だけの表示
応用で、こんな風にデザイン時だけ表示されるようにすることもできます。
こんなプロパティを作ります。
/// <summary> /// デザインモード時のみVisibleとなるプロパティ /// </summary> public static Visibility IsDesignModeVisible { get { var isDesignMode = DesignerProperties.GetIsInDesignMode(new DependencyObject()); return isDesignMode ? Visibility.Visible : Visibility.Collapsed; } }
こうすると、VisualStudioなどのXAMLデザイナ上でだけ表示され、アプリの実行時には表示されないようにすることができます。
MainWindow.xaml
<StackPanel HorizontalAlignment="Left"> <Button Width="75" Margin="5" Content="Button1" /> <Button Width="75" Margin="5" Content="Button2" Visibility="{x:Static local:Misc.IsDebugVisible}"/> <Button Width="75" Margin="5" Content="Button3" Visibility="{x:Static local:Misc.IsDesignModeVisible}"/> </StackPanel>
Misc.cs
using System; using System.Collections.Generic; using System.ComponentModel; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; namespace WpfApplication1 { public class Misc { /// <summary> /// DebugモードのみVisibleとなるプロパティ /// </summary> /// <remarks> /// コントロールのVisibilityプロパティに設定すると、 /// Debugビルド時のみ表示、という表示切替ができます。 /// </remarks> public static Visibility IsDebugVisible { #if DEBUG get { return Visibility.Visible; } #else get { return Visibility.Collapsed; } #endif } /// <summary> /// デザインモード時のみVisibleとなるプロパティ /// </summary> public static Visibility IsDesignModeVisible { get { var isDesignMode = DesignerProperties.GetIsInDesignMode(new DependencyObject()); return isDesignMode ? Visibility.Visible : Visibility.Collapsed; } } } }
以上、XAML表示切替のちょっとした小ネタでした。