#UWP#期中项目，做一个网络电视

最新推荐文章于 2019-05-14 15:31:37 发布

LoHiauFung

最新推荐文章于 2019-05-14 15:31:37 发布

阅读量3.8k

点赞数 3

分类专栏： UWP 文章标签： UWP

本文链接：https://blog.csdn.net/LoHiauFung/article/details/74504555

版权

UWP 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

网络电视

简介

实现的功能就是在电脑上看电视，如下面两张图，可以看电视直播，并且有个侧边栏可以选台，还可以登陆客户端，再在网站上用手机登登陆就可以实现用手机遥控电脑看电视了。
因为服务器是队友搭的，现在是期末了，也不好再叫别人来搞，所以这里是没有遥控的截图，但我的代码有与服务器交互的部分。
这里写图片描述

涉及的难点：

1.侧边栏的实现

使用一个控件splitView来展开和收起.splitView内有一个border，通过监听鼠标进入与移出，改变splitView的状态，从而实现打开和关闭。
这里写图片描述

2.登陆框的实现

其实就是一个ContentDialog控件，嵌套了密码框，账号框，跟两个按钮。点击侧边栏的“登陆”的时候，让这个ContentDialog的visibility设为true就好了。

 <!-- 登陆界面 -->
                <ContentDialog x:Name="loginDialog">
                    <StackPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                        <TextBox x:Name="accountBox" Header="Account"/>
                        <PasswordBox  x:Name="passwordBox" Header="Password"/>
                        <Grid HorizontalAlignment="Center">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <Button x:Name="loginButton" Grid.Column="0" Content="登陆" Click="clickToLogin"/>
                            <Button x:Name="cancel" Grid.Column="1" Content ="取消" Click="clickToCancelLogin"/>
                        </Grid>
                    </StackPanel>
                </ContentDialog>

3.播放网络视频

这里用的是MediaPlayerElement 控件，可以播放HLS格式的播放源，使用方法见MSDN文档: MediaPlayerElement的自适应流式处理
https://docs.microsoft.com/zh-cn/windows/uwp/audio-video-camera/adaptive-streaming

<!-- 播放器 -->
                <MediaPlayerElement x:Name="mediaPlayerElement" HorizontalAlignment="Stretch" AreTransportControlsEnabled="True"  />
                ![这里写图片描述](https://img-blog.csdn.net/20170705221605098?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvTG9IaWF1RnVuZw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)

4.播放源哪里来？

MediaPlayerElement只支持HLS流媒体协议，所以我们要找HLS协议的播放源。播放源全靠自己到网上搜索，而且有时效性，下面是我用的，不一定读者看的是后还能用。

public channelList()
        {
            cLists.Add(new TVchannel(0, "CCTV风云音乐", "http://222.191.24.6:6610/2/2/ch00000090990000001214/index.m3u8?ispcode=3"));
            cLists.Add(new TVchannel(1, "CCTV西部旅游", "http://livertmp2-cnc.wasu.cn/zhibo/scgx_xbly/playlist.m3u8"));
            // cLists.Add(new TVchannel(2, "CCTV大众生活", "http://livertmp2-cnc.wasu.cn/zhibo/scgx_dzsh/playlist.m3u8"));
            cLists.Add(new TVchannel(2, "CCTV国防军事", "http://222.191.24.6:6610/2/2/ch00000090990000001205/playlist.m3u8?ispcode=3"));
            cLists.Add(new TVchannel(3, "CCTV-1高清", "http://183.251.61.207/PLTV/88888888/224/3221225812/index.m3u8"));
            cLists.Add(new TVchannel(4, "CCTV-7高清", "http://120.87.4.5/PLTV/88888894/224/3221225492/index.m3u8"));
            cLists.Add(new TVchannel(5, "CCTV-12", "http://183.207.249.15/PLTV/2/224/3221226019/index.m3u8"));
            cLists.Add(new TVchannel(6, "CCTV-14", "http://183.207.249.15/PLTV/2/224/3221226023/index.m3u8"));
            cLists.Add(new TVchannel(7, "CCTV 5+", "http://222.191.24.7:6610/2/2/ch00000090990000001297/index.m3u8?ispcode=3"));
            cLists.Add(new TVchannel(8, "香港31台", "http://rthklive1-lh.akamaihd.net/i/rthk31_1@167495/index_1296_av-p.m3u8"));
            cLists.Add(new TVchannel(9, "香港32台", "http://rthklive2-lh.akamaihd.net/i/rthk32_1@168450/index_1296_av-b.m3u8"));
            cLists.Add(new TVchannel(10, "香港卫视", "http://live.hkstv.hk.lxdns.com/live/hks/playlist.m3u8"));
            cLists.Add(new TVchannel(11, "凤凰中文", "http://119.167.138.7/live/zhongwen.m3u8"));
            cLists.Add(new TVchannel(12, "凤凰资讯", "http://119.167.138.7/live/zixun.m3u8"));
        }

5.怎样用手机遥控？

这就涉及到一个实时通信协议，webSocket，这个协议允许服务器向客户端发送协议，避免了客户端无限request造成的带宽浪费。
webSocket客户端写法可以参考官方文档
https://docs.microsoft.com/zh-cn/windows/uwp/networking/websockets

下面是登陆的代码，由”登陆”按钮的clicked事件来创建一个新线程来向服务器发送登陆消息。

private async System.Threading.Tasks.Task verifyUserAsync()
        {

            // 登陆
            // target url
            Uri serverUri = new Uri("ws://123.207.78.54:8001/");
            string userName = accountBox.Text;
            string password = passwordBox.Password;
            // string userName = "r1VgfuVg-";
            // string password = "123";
            // login
            try
            {
                //Connect to the server.
                await webSock.ConnectAsync(serverUri);

                //Send a message to the server.
                await WebSock_SendMessageAsync(webSock, "{\"id\":\"" + userName + "\",\"password\":\"" + password + "\"}");

            }
            catch (Exception ex)
            {
                //Add code here to handle any exceptions
            }
            // loginDialog.Hide();
        }

下面是就收服务器信号,根据收到的不同信号来决定换台还是关电视。

 private void WebSock_MessageReceived(MessageWebSocket sender, MessageWebSocketMessageReceivedEventArgs args)
        {
            DataReader messageReader = args.GetDataReader();
            messageReader.UnicodeEncoding = UnicodeEncoding.Utf8;
            string messageString = messageReader.ReadString(messageReader.UnconsumedBufferLength);

            //Add code here to do something with the string that is received.
            JObject jo = JObject.Parse(messageString);

            // login, get userName
            if (userName == null && Boolean.Parse(jo["success"].ToString()) == true)
            {
                userName = jo["username"].ToString();
                // 改状态为已登陆
                shellForchangeToLoginedStateAsync();
                // loginDialog.Hide();
            }
            // change channel
            else
            {
                // 如果换台信号就换，否则收到shutdown，关电视
                try
                {
                    int cid = int.Parse(jo["myNum"].ToString());
                    ShellToChangeChannelInUIAsync(cid);
                } catch
                {
                    App.Current.Exit();
                }
            }

        }

关闭连接

 private void WebSock_Closed(IWebSocket sender, WebSocketClosedEventArgs args)
        {
            //Add code here to do something when the connection is closed locally or by the server
            // 改登陆状态为未登录
            ShellTochangeToNotLoginedStateAsync();
        }