WPF音乐播放器 零基础4个小时左右

devtools/2024/9/25 9:35:57/

前言：winfrom转wpf用久的熟手说得最多的是,转回去做winfrom难。。当时不明白。。做一个就知道了。

WPF音乐播放器

入口主程序

 FontFamily="Microsoft YaHei" FontSize="12" FontWeight="ExtraLight"
居中显示WindowStartupLocation="CenterScreen" ResizeMode="NoResize"Title="音娱乐行音乐播放器" Height="600" Width="1010"
无边框 
<WindowChrome.WindowChrome><WindowChrome GlassFrameThickness="1"/></WindowChrome.WindowChrome>
StackPanel 块  Orientation="Horizontal" 水平显示  HorizontalAlignment="Center" 居中<StackPanel Orientation="Horizontal" HorizontalAlignment="Center"><Border Width="28" Height="28" CornerRadius="10"><Border.Background><ImageBrush ImageSource="../Assets/Images/Logo.png" Stretch="UniformToFill" Viewport="-0.3,-0.3,1.6,1.6"Opacity="0.5"/></Border.Background><TextBlock Text="&#xe600;" FontFamily="{StaticResource FF}" VerticalAlignment="Center" HorizontalAlignment="Left"FontSize="20" Foreground="ForestGreen" Height="19" Width="18" Margin="-14,0,0,0"><TextBlock.Effect><DropShadowEffect BlurRadius="5" Color="ForestGreen" ShadowDepth="0" Opacity="0.5"/></TextBlock.Effect></TextBlock></Border><TextBlock Text="音娱乐行播放器" VerticalAlignment="Center" Margin="10,0,0,0" Foreground="Orange"FontSize="13" FontWeight="Bold"/></StackPanel>

**************

菜单栏目

 <StackPanel Grid.Row="1"><RadioButton Content="首页" Tag="&#xe715;" Style="{StaticResource MenuButtonStyle}" IsChecked="True"/><RadioButton Content="有声动态谱" Tag="&#xe715;" Style="{StaticResource MenuButtonStyle}" IsChecked="True"/><RadioButton Content="精品歌单" Tag="&#xe66a;" Style="{StaticResource MenuButtonStyle}"/><RadioButton Content="歌手推荐" Tag="&#xe895;" Style="{StaticResource MenuButtonStyle}"/><RadioButton Content="单曲排行" Tag="&#xe608;" Style="{StaticResource MenuButtonStyle}"/><Label Content="音乐分类" Tag="&#xe62f;" Style="{StaticResource MenuLabelStyle}"/><UniformGrid Columns="3" Margin="40,0,10,0"><RadioButton Content="流行" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="民谣" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="电子" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="舞曲" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="说唱" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="轻音乐" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="爵士" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="乡村" Style="{StaticResource ClassButtonStyle}"/><RadioButton Content="更多" Style="{StaticResource ClassButtonStyle}"/></UniformGrid><Label Content="我的音乐" Tag="&#xe645;" Style="{StaticResource MenuLabelStyle}"/><ItemsControl ItemsSource="{Binding SList}" Margin="40,0,10,0"><ItemsControl.ItemTemplate><DataTemplate><RadioButton Content="{Binding Header}" Tag="{Binding Icon}" Style="{StaticResource SheetButtonStyle}"/></DataTemplate></ItemsControl.ItemTemplate></ItemsControl></StackPanel>

样式控件

MenuButtonStyle 样式 
// <Border 没法放两个以上对象 需要<StackPanel  包起来  <TextBlock 图标 <ContentPresente 内容
// <ControlTemplate.Triggers> 控件触发器  <Style.Triggers>样式触发器<Style TargetType="RadioButton" x:Key="MenuButtonStyle"><Setter Property="Foreground" Value="#B1AFBA"/><Setter Property="GroupName" Value="A"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="RadioButton"><Border BorderBrush="Transparent" BorderThickness="2,0,0,0" Name="border" Height="30" Margin="0,3"><StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="20,0,0,0"><TextBlock Text="{TemplateBinding Tag}" FontFamily="{StaticResource FF}"FontSize="18"/><ContentPresenter VerticalAlignment="Center" Margin="10,0,0,0"/></StackPanel></Border><ControlTemplate.Triggers><Trigger Property="IsChecked" Value="True"><Setter TargetName="border" Property="BorderBrush" Value="#AA6063FB"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter><Style.Triggers><Trigger Property="IsChecked" Value="True"><Setter Property="Foreground" Value="#6063FB"/></Trigger></Style.Triggers></Style>
MenuLabelStyle 样式<Style TargetType="Label" x:Key="MenuLabelStyle"><Setter Property="Foreground" Value="#555"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="Label"><Border BorderBrush="Transparent" BorderThickness="2,0,0,0" Name="border" Height="30" Margin="0,3"><StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="20,0,0,0"><TextBlock Text="{TemplateBinding Tag}" FontFamily="{StaticResource FF}"FontSize="18"/><ContentPresenter VerticalAlignment="Center" Margin="10,0,0,0"/></StackPanel></Border></ControlTemplate></Setter.Value></Setter></Style>ClassButtonStyle 样式<Style TargetType="RadioButton" x:Key="ClassButtonStyle"><Setter Property="Foreground" Value="#B1AFBA"/><Setter Property="FontSize" Value="11"/><Setter Property="GroupName" Value="A"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="RadioButton"><Border Height="24" Background="#EEE" Margin="1" CornerRadius="3"Name="border"><ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/></Border><ControlTemplate.Triggers><Trigger Property="IsMouseOver" Value="True"><Setter TargetName="border" Property="Background" Value="#116063FB"/></Trigger><Trigger Property="IsChecked" Value="True"><Setter TargetName="border" Property="BorderBrush" Value="#AA6063FB"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter><Style.Triggers><Trigger Property="IsChecked" Value="True"><Setter Property="Foreground" Value="#6063FB"/></Trigger></Style.Triggers></Style>

后台绑定数据

指定关系

 DataContext = new MainViewModel();

右侧内容

 <!--右侧内容--><Grid Grid.Column="1"><Grid.RowDefinitions><RowDefinition Height="50"/><RowDefinition/></Grid.RowDefinitions><TextBox Height="28" Width="180" HorizontalAlignment="Left"Style="{StaticResource SearchTextBoxStyle}"VerticalContentAlignment="Center" Margin="30,0"/><!--页面内容  VerticalScrollBarVisibility="Hidden" 隐藏滚动条--><ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Hidden"><Grid Margin="30,0"><p:FirstPage/>  fistpage 页面</Grid></ScrollViewer></Grid>

爬虫

数据绑定

 <TextBlock Text="热门专辑" VerticalAlignment="Center" FontWeight="Bold"Foreground="#555"/><ListBox Grid.Row="1" BorderThickness="0" Background="Transparent"ItemsSource="{Binding AlbumList}" ScrollViewer.HorizontalScrollBarVisibility="Hidden"><ListBox.ItemsPanel><ItemsPanelTemplate><VirtualizingStackPanel Orientation="Horizontal"/>  水平显示</ItemsPanelTemplate></ListBox.ItemsPanel><ListBox.ItemContainerStyle>  模板<Style TargetType="ListBoxItem"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="ListBoxItem">  关键 控件模板<ContentPresenter Margin="5"/></ControlTemplate></Setter.Value></Setter></Style></ListBox.ItemContainerStyle><ListBox.ItemTemplate><DataTemplate>    数据模板<Grid>
<Grid.RowDefinitions><RowDefinition/><RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Border Width="100" Height="100" CornerRadius="5" ><Border.Background><ImageBrush ImageSource="{Binding Cover}"/></Border.Background><Border.Effect><DropShadowEffect BlurRadius="5" ShadowDepth="0" Color="Gray" Opacity="0.5"/></Border.Effect>
</Border>

数据列表绑定

数据细节处理

ps：学wpf没有个大屏是个阻力哈哈哈

播放控制器

 DataContext.PlayDownloadCommand,RelativeSource
播放命令指向信息<Style TargetType="ListBoxItem"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="ListBoxItem"><Grid Background="Transparent" Name="root"><ContentPresenter/><TextBlock Grid.Column="3" VerticalAlignment="Center" HorizontalAlignment="Center"Margin="100,0,0,0"FontSize="11" Name="tb_control" Visibility="Collapsed"><Hyperlink TextDecorations="None" Command="{Binding DataContext.PlayDownloadCommand,RelativeSource={RelativeSource AncestorType=Window}}"CommandParameter="{Binding}">播放</Hyperlink><Hyperlink TextDecorations="None">添加</Hyperlink></TextBlock></Grid><ControlTemplate.Triggers><Trigger Property="IsMouseOver" Value="True"><Setter TargetName="root" Property="Background" Value="#44ECEAF6"/><Setter TargetName="tb_control" Property="Visibility" Value="Visible"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style>

指向信息帮助类 有点深入自己看

public class Command<T> : ICommand
{public event EventHandler? CanExecuteChanged;public bool CanExecute(object? parameter){return true;}public void Execute(object? parameter){dynamic param = parameter;DoExecute?.Invoke(param);}public Action<T> DoExecute { get; set; }public Command(Action<T> action){DoExecute = action;}
}public class Command : Command<object>
{public Command(Action action) : base(obj => action?.Invoke()) { }
}

其他类似

小经验

分界线 深吭来了

    public async void Play(SongModel song){var options = new LaunchOptions { Headless = true };// 这里有个深坑哈  先要跑一边 下载运行环境 后 注释掉 // await new BrowserFetcher().DownloadAsync(BrowserFetcher.DefaultChromiumRevision);//注意 两个usingusing (var browser = await Puppeteer.LaunchAsync(options))using (var page = await browser.NewPageAsync()){await page.GoToAsync(song.Url);//请求之后 就是用语法  有就获取srcvar jsSelectAllAnchors = @"Array.from(document.querySellectorAll('audio')).map(a=>a.src);";var urls=await page.EvaluateExpressionAsync<string[]>(jsSelectAllAnchors);if (urls != null&&urls.Length>0){wc.DownloadFile(urls[0],"./songs/"+song.SongName+".mp3");   }}}

遇到的问题 jsSelectAllAnchors 这里面的命令哪里来的 写错了一个单词 找了有点久 

细节UI 播放控制台

双击

跑起来了 

简单的播放 可以下载播放 下载延迟很耗时间 

小编表示 wpf 界面代码写起来 这还是有点底子 ，写起来 比vue webfrom react 都麻烦=.=。。。。。

.net几行代码音乐API各排行榜 热搜 入库-CSDN博客

ABP.Next系列02 搭个API框架要多久 项目下载 运行 -Fstyle_【abp vnext】下载并运行web api项目详细教程文档-CSDN博客


http://www.ppmy.cn/devtools/46448.html

相关文章

5G NR TAE TEST

5G NR TAE TEST

环境配置&#xff1a; 测试TAE时&#xff0c;需要比对不同的Antenna Port之间的差异来测试 配置DL 2 layer MU的case layer1&#xff1a;通过设置weight&#xff0c;只有一个物理天线上有weight&#xff0c;其他天线上的weight为0&#xff0c;该天线的DMRS DMRS Port设置为1…
阅读更多...
Win 11官宣取消硬件限制，微软这次彻底服软了

Win 11官宣取消硬件限制，微软这次彻底服软了

上市近 3 年&#xff0c;微软寄予厚望的 Win 11 终究落了个被上代 Win 10 光环狠狠掩埋的结局。 有小伙伴儿认为是 Win 11 本身做的太烂&#xff0c;更新频繁、BUG 一堆&#xff0c;让人失去兴趣。 也有人认为&#xff0c;系统本身体验没啥大毛病&#xff0c;严苛的硬件限制才…
阅读更多...
【java11】java11新特性之标准HttpClient

【java11】java11新特性之标准HttpClient

Java 9中引入了增强的HttpClient API作为实验性功能。在Java 11中&#xff0c;现在HttpClient是一个标准。 Java 11引入了一个新的标准HttpClient API&#xff0c;用于替代旧的HttpURLConnection&#xff0c;提供了更现代、更灵活的HTTP通信方式。这个API支持同步和异步请求、…
阅读更多...
数字塔问题

数字塔问题

#include<iostream> using namespace std; //从下向上得到最优值 void dtower(int a[][100],int s[][100],int n) {for(int in; i>1; i--){for(int j1; j<i; j){if(in)s[i][j]a[i][j];else{int ts[i1][j];if(t<s[i1][j1])ts[i1][j1];s[i][j]a[i][j]t;}}} } void…
阅读更多...
Python报错：AttributeError: ＜unknown＞.DeliveryStore 获取Outlook邮箱时报错

Python报错：AttributeError: ＜unknown＞.DeliveryStore 获取Outlook邮箱时报错

目录 报错提示&#xff1a; 现象描述 代码解释&#xff1a; 原因分析&#xff1a; 报错提示&#xff1a; in get_outlook_email return account.DeliveryStore.DisplayName line 106, in <module> email_address get_outlook_email() 现象描述 获取outlook本地邮箱…
阅读更多...
【Linux】自己实现一个bash进程

【Linux】自己实现一个bash进程

目录 读入用户输入 对字符串进行分割 处理内建命令 cd命令 export echo 处理重定向 代码汇总 bash就是命令行解释器&#xff0c;就是Linux操作系统让我们看到的&#xff0c;与用户进行交互的一种外壳&#xff08;shell&#xff09;&#xff0c;当然了bash也是一个进程&…
阅读更多...
【稳定检索/投稿优惠】2024年商务、信息管理与大数据经济国际会议(BIMBDE 2024)

【稳定检索/投稿优惠】2024年商务、信息管理与大数据经济国际会议(BIMBDE 2024)

2024 International Conference on Business, Information Management, and Big Data Economy 2024年商务、信息管理与大数据经济国际会议 【会议信息】 会议简称&#xff1a;BIMBDE 2024 大会地点&#xff1a;中国北京 会议官网&#xff1a;www.bimbde.com 会议邮箱&#xff…
阅读更多...
AI程序员来了，大批码农要失业

AI程序员来了，大批码农要失业

根据GitHub发布的《Octoverse 2021年度报告》&#xff0c;2021年中国有755万程序员&#xff0c;排名全球第二。 ChatGPT的出现&#xff0c;堪比在全球互联网行业点燃了一枚“核弹”&#xff0c;很多人都会担心“自己的工作会不会被AI取代”。 而2024年的AI进展速度如火箭般&am…
阅读更多...
最新文章

Copyright @ 2022~2023