Search code examples
wpfdata-bindingdesignmode

How to set a value to display for bound properties in WPF design mode?


My bound contents are showed as empty string in the UI design-mode. I want to display some faked value for those contents but I don't know how to.

Please share if you know how to. Thank you!


Solution

  • An easy way to get Design-time-data in Visual Studio 2010 is to use a design-datacontext. Short example with a Window and a ViewModel, For DataContext, the d:DataContext will be used in Design-mode and the StaticResource will be used in runtime. You can also use a separate ViewModel for design but in this example I will use the same ViewModel for both.

    <Window ...
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:local="clr-namespace:DesignTimeData"
            mc:Ignorable="d"            
            d:DataContext="{d:DesignInstance local:MyViewModel,
                            IsDesignTimeCreatable=True}">
        <Window.Resources>
            <local:MyViewModel x:Key="MyViewModel" />
        </Window.Resources>
        <Window.DataContext>
            <StaticResource ResourceKey="MyViewModel"/>
        </Window.DataContext>
        <StackPanel>
            <TextBox Text="{Binding MyText}"
                     Width="75"
                     Height="25"
                     Margin="6"/>
        </StackPanel>
    </Window>
    

    And in the ViewModels property MyText we check if we're in design mode and in that case we return something else.

    public class MyViewModel : INotifyPropertyChanged
    {
        public MyViewModel()
        {
            MyText = "Runtime-Text";
        }
    
        private string m_myText;
        public string MyText
        {
            get
            {
                // Or you can use
                // DesignerProperties.GetIsInDesignMode(this)
                if (Designer.IsDesignMode)
                {
                    return "Design-Text";
                }
                return m_myText;
            }
            set
            {
                m_myText = value;
                OnPropertyChanged("MyText");
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        private void OnPropertyChanged(string propertyName)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
    

    Designer.cs, which is found here, looks like this

    public static class Designer
    {
        private static readonly bool isDesignMode;
        public static bool IsDesignMode
        {
            get { return isDesignMode; }
        }
        static Designer()
        {
            DependencyProperty prop =
                DesignerProperties.IsInDesignModeProperty;
            isDesignMode =
                (bool)DependencyPropertyDescriptor.
                    FromProperty(prop, typeof(FrameworkElement))
                          .Metadata.DefaultValue;
        }
    }