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();
});


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"));