网站开发翻译功能,火蝠电商,做网站能带来什么问题,wordpress 调用多媒体文章目录 前言项目地址动态样式组合样式批量样式覆盖Prism新建UserControler修改Material Design 笔刷收放列表可以滚动的StackPanel列表点击展开或折叠 实现效果 前言
今天接着继续细化代码#xff0c;把整体框架写出来
项目地址 WPF仿网易云 Gitee仓库 动态样式 【WPF】C#… 文章目录 前言项目地址动态样式组合样式批量样式覆盖Prism新建UserControler修改Material Design 笔刷收放列表可以滚动的StackPanel列表点击展开或折叠 实现效果 前言
今天接着继续细化代码把整体框架写出来
项目地址 WPF仿网易云 Gitee仓库 动态样式 【WPF】C#代码动态改变控件的样式 声明个Style变量
public class IconButton
{public string Name { get; set; }public string Icon { get; set; }public RelayCommand RelayCommand { get; set; }public Style Style { get; set; }
}引入资源字典通过Key查找样式
public ResourceDictionary StyleResource { get; set; }public TitileViewModel() {StyleResource new ResourceDictionary(){//Uri路径是/项目;componet/文件路径Source new Uri(/BlankApp1;component/ViewStyles/TitleStyle.xaml,UriKind.RelativeOrAbsolute)};IconButton new IconButton(){Name EmailBox,Icon EmailBox,RelayCommand new RelayCommand(() {Debug.WriteLine(按钮测试);}),Style (Style)StyleResource[SelectIcon]};
}组合样式
但是我发现我用不了这个好像不好用 [WPF]控件应用多个样式 批量样式覆盖
由于WPF的Style没有Css 的类选择器而且WPF 不允许同时设置多个样式所以WPF的样式写起来很啰嗦
批量样式设置可以设置某个控件的Resource在里面添加Style
Grid Background#FF6666Grid.Resources!--你的样式覆盖这个会对所有的Grid里面的控件生效--Style TargetTypeTextBlockBasedOn{StaticResource TitleText}/Style/Grid.Resources
/Grid但是对于Materail Design 控件无效需要特殊方法覆盖样式。但是根据我的测试无法覆盖只能硬写。要么就用数据模板批量赋值。我折腾了两天想想还是放弃了WPF 的Style 的缺陷没办法避免写起来就是麻烦。
根据实际测试只能覆盖原生的控件不能覆盖Material Design的控件样式。 Overriding Material Design Styles Prism新建UserControler 修改Material Design 笔刷 C# WPF Material Design MaterialDesignFlatButton Hint\HighLight Color 使用的Key覆盖的方法将Material Design 的笔刷的Key覆盖。这也说明了为什么Material Design不能直接全局覆盖 为什么这么设置就可能需要看源码了。这里面的Style依赖太过于复杂我暂时就不去琢磨了。
根据我的测试修改SolidColorBrush就可以了。
收放列表 这个分为两部分按钮事件和列表展开收缩。
可以滚动的StackPanel
!--在外侧添加一个ScrollViewer我这里使用了VerticalScrollBarVisibility来隐藏滚动条--
ScrollViewer VerticalScrollBarVisibilityHidden
/ScrollViewer列表
新建一个ListString存放歌单
public Liststring MusicItems { get; set; }
.......MusicItems new Liststring() {五月天,夜曲,Deep Dark,Link Park,JoJo
};使用数据模板绑定数据源
!--指定数据源--
ItemsControl ItemsSource{Binding MusicItems} Visibility{Binding Visibility}!--数据容器选择StackPanel--ItemsControl.ItemsPanelItemsPanelTemplateStackPanel //ItemsPanelTemplate/ItemsControl.ItemsPanelItemsControl.ItemTemplateDataTemplateButtonStackPanel OrientationHorizontalMD:PackIcon KindMusicNoteSixteenthWidth12Height12VerticalAlignmentCenter /!--如果是基本元素列表直接Binding就好了--TextBlock Text{Binding}FontSize12Margin 10 0 0 0 //StackPanel/Button/DataTemplate/ItemsControl.ItemTemplate
/ItemsControl点击展开或折叠
我这里没做动画动画太难了先实现基本逻辑
public partial class LeftListViewModel : ObservableObject
{public Liststring MusicItems { get; set; }/// summary/// 歌单列表展开或者关闭/// /summarypublic RelayCommand MusicItemsOpenOrClose { get; set; }/// summary/// 通过是否可见来设置列表/// /summary[ObservableProperty]private Visibility visibility;public LeftListViewModel(){Visibility Visibility.Hidden;MusicItems new Liststring() {五月天,夜曲,Deep Dark,Link Park,JoJo};MusicItemsOpenOrClose new RelayCommand(() {if(Visibility Visibility.Visible){Visibility Visibility.Hidden;}else{Visibility Visibility.Visible;}});}
}然后在按钮上面添加点击事件
Button Command{Binding MusicItemsOpenOrClose}StackPanel OrientationHorizontalMD:PackIcon KindFormatListBulletedVerticalAlignmentCenter /TextBlock Text歌曲列表Margin 10 0 0 0 //StackPanel
/Button完整代码可以看我的Gitee仓库 WPF仿网易云 Gitee仓库 实现效果
