WPF的MVVM模式

mvvm模式：model   view   viewmodel

model：

public class NavicateModel
    {
        public string Name { get; set; }
    }

viewmodel：需要继承INotifyPropertyChanged

public class MainViewModel : INotifyPropertyChanged
    {

        public event PropertyChangedEventHandler PropertyChanged;
        private void RaisePropertyChanged(string propertyName)
        {
            // take a copy to prevent thread issues
            //PropertyChangedEventHandler handler = PropertyChanged;
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        private ObservableCollection<NavicateModel> _navicateModelList;
        public ObservableCollection<NavicateModel> NavicateModelsList
        {
            get { return _navicateModelList; }
            set
            {
                _navicateModelList = value;
                RaisePropertyChanged("NavicateModelsList");
            }
        }
        public MainViewModel()
        {
            NavicateModelsList = new ObservableCollection<NavicateModel>();
            foreach (MenuEnum menuEnum in Enum.GetValues(typeof(MenuEnum)))
            {
                NavicateModelsList.Add(new NavicateModel { Name = menuEnum.ToString() });
            }
            NavicateModelsList.Add(new NavicateModel { Name = "持续更新中" });
        }
        private NavicateModel _navicateModel;
        public NavicateModel NavicateModelItem
        {
            get { return _navicateModel; }
            set
            {
                _navicateModel = value; RaisePropertyChanged("NavicateModelItem");
            }
        }
        //左侧导航栏  用于绑定右侧界面
        private object _controllPanel;

        public object ControllPanel
        {
            get { return _controllPanel; }
            set
            {
                _controllPanel = value;
                RaisePropertyChanged("ControllPanel");
            }
        }
        //初始化的界面
        public ICommand OnLoadCommand => new MyCommand(obj =>
        {


        });
        //加载新界面
        public ICommand NavicateChanged => new MyCommand(obj =>
        {
            if (obj == null) return;
            var model = obj as NavicateModel;
            MenuItemSelection(model.Name);
        });

view就是你的界面。可以再界面上绑定命令。由于我是将用户控件和主窗体分开的，上用户控件的代码

  <Canvas x:Name="containerCanvas" Margin="100">
        <TextBlock  Text="{Binding Text,ElementName=spotLight}" Foreground="LightGray" FontSize="50"/>
        <TextBlock x:Name="GeometryText" Text="{Binding Text,ElementName=spotLight}" FontSize="50">
            <TextBlock.Foreground>
                <LinearGradientBrush EndPoint="1,1" MappingMode="RelativeToBoundingBox" StartPoint="0,0">
                    <GradientStop Color="#FF9C1031" Offset="0.1"/>
                    <GradientStop Color="#FFBE0E20" Offset="0.2"/>
                    <GradientStop Color="#FF9C12AC" Offset="0.7"/>
                    <GradientStop Color="#FF0A8DC3" Offset="0.8"/>
                    <GradientStop Color="#FF1AEBCC" Offset="1"/>
                </LinearGradientBrush>
            </TextBlock.Foreground>
            <TextBlock.Clip>
                <EllipseGeometry x:Name="PART_EllipseGeometry">
                    <EllipseGeometry.Transform>
                        <TranslateTransform/>
                    </EllipseGeometry.Transform>
                </EllipseGeometry>
            </TextBlock.Clip>
        </TextBlock>
        <Path Name="myPathShape" Fill="Transparent">
            <Path.Data>
                <EllipseGeometry x:Name="MyEllipseGeometry" Center="0,70" RadiusX="100" RadiusY="100" />
            </Path.Data>
            <Path.Triggers>
                <EventTrigger RoutedEvent="Path.Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <!--<DoubleAnimation  Storyboard.TargetName="MyEllipseGeometry" Storyboard.TargetProperty="Width"  From="0" To="650" Duration="0:0:2" AutoReverse="True" RepeatBehavior="Forever"/>-->
                            <PointAnimation  Storyboard.TargetName="MyEllipseGeometry" Storyboard.TargetProperty="Center" From="0,70" To="350,70" Duration="0:0:1" AutoReverse="True" RepeatBehavior="Forever"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Path.Triggers>
        </Path>
    </Canvas>

如果有自定义的属性需要注册：

public string Text
        {
            get { return (string)GetValue(TextProperty); }
            set
            {
                SetValue(TextProperty, value);

            }
        }

        // Using a DependencyProperty as the backing store for Text.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty TextProperty =
            DependencyProperty.Register("Text", typeof(string), typeof(SpotLight), new PropertyMetadata("WPFDeveloper"));