目录

说明

上一篇博客将源码放出来了,但是并没有做过多的介绍,所以如果自己硬看可能需要花费很长的时间,尤其这些代码并不是自己写的。项目不算复杂但是也不算简单,这篇文章我尽我所能将整个项目结构、关键的代码全部解释一下,希望能给对本项目感兴趣的童鞋、以及那些UWP初学者一些帮助。

背景了解

【完全开源】知乎日报UWP(上篇):界面设计、官方API分析。

【完全开源】知乎日报UWP(下篇):商店APP、github源码。Windows APP良心出品。

github源码

商店APP

项目结构

项目截图

类型说明

ZhiHuDaily.UWP.Core.Controls

里面只有一个SwipeableSplitView控件,该控件继承自SplitView。该控件来自github:https://github.com/JustinXinLiu/SwipeableSplitView

ZhiHuDaily.UWP.Core.Data

支持自增式加载的集合,继承自ObservableCollection,并且实现了ISupportIncrementalLoading接口。一共4个:

  • CollectionsStoriesIncrementalLoadingCollection(对应收藏页面文章列表)
  • HomeStoriesIncrementalLoadingCollection(对应主页文章列表)
  • StoryCommentsIncrementalLoadingCollection(对应评论页面评论(长/短)列表)
  • ThemeStoriesIncrementalLoadingCollection(对应主题日报页面列表)

ZhiHuDaily.UWP.Core.Https

对Web API接口的封装,包含Web API URL、HTTP请求、JSON序列化。

ZhiHuDaily.UWP.Core.Models

用到的所有实体类。注意每个实体类并没有对应到返回的Json数据体(因为返回的Json中很多字段都没有使用到)。

ZhiHuDaily.UWP.Core.Share

微信分享相关的代码。以后新增的其他分享(如QQ分享、微博分享)的代码都可以放在这里。

ZhiHuDaily.UWP.Core.Tools

工具类。网络类型管理类、文件管理类、Dispatcher管理类(解决非UI线程更新数据源引起的bug)。

ZhiHuDaily.UWP.Core.ViewModels

用到的所有ViewModel。基本每个页面对应一个ViewModel。命名规则跟Xaml页面一致(将Page改为ViewModel)。

ZhiHuDaily.UWP.Mobile

所有的Page页面。

UI页面

包含以下(按项目结构从上到下):

CollectionPage.Xaml

收藏页面,使用到了ListView控件、自增式集合
EditorsPage.Xaml

主编列表页面,使用到了ListView控件
HomePage.Xaml

主页,使用到了ListView、FlipView控件,自增式集合
RecommendersPage.Xaml

推荐者列表页面,使用到了ListView控件
    SettingPage.Xaml

    设置页面,使用到的都是普通控件
SplashPage.Xaml

启动页面,使用到的都是普通控件
StoryCommentPage.Xaml

文章评论页面,使用到了Pivot控件、ListView控件,自增式集合
StoryPage.Xaml

文章内容页面,使用到了WebView控件,自己格式化HTML
ThemePage.Xaml

主题日报页面,使用到了ListView控件,自增式集合

关键技术

粗略的总结一下,大概用到了以下技术:

  • Data Binding。这个必须会,wpf、uwp开发都要用到;
  • 页面导航。Frame.Navigate()、Frame.GoBack()等等,导航时传参;
  • 页面缓存。NavigationCacheMode枚举值;
  • HttpClient类型的使用。主要是get请求;
  • Json格式化。在.NET中很方便,using Windows.Data.Json;
  • 缓存处理。我做的很粗糙,大概就是将不变的内容下载下来后存成json格式文本,下载直接使用,包括图片也是,并没有将url直接赋值给Image.Source属性;
  • 自增式加载。这个也是重点,大概就是要实现ISupportIncrementalLoading这个接口,具体的做法参考源代码;
  • 依赖属性注册。有的控件并没有某个属性,导致我们不能使用Data Binding(数据绑定),这时候就需要给控件注册一个属性;
  • MVVM模式。这个不用说,不过我项目中并没有严格按照这个来;
  • WebView控件的使用。WebView很强大,参照我之前的一篇博客:WebView做聊天框
  • 微信分享。参考微信官方文档即可,怎样唤醒APP,参考这篇博客:APP之间的数据交互

其它没什么。至于页面Xaml的编写,这个要熟,多写写,就能控制好格式,就像你写html/css一样。

演示视频

上一篇博客中有一个视频,但是不清楚,后来录了一个稍微清楚的:

开源有益,多谢点赞!

【完全开源】知乎日报UWP版:项目结构说明、关键源代码解释的更多相关文章

  1. 【完全开源】知乎日报UWP版(下篇):商店APP、github源码、功能说明。Windows APP 良心出品。

    目录 说明 功能 截图+视频 关于源码和声明 说明 陆陆续续大概花了一个月的时间,APP算是基本完成了.12月份一直在外出差,在出差期间进行了两次功能完善,然后断断续续修补了一些bug,到目前为止,我 ...

  2. 【完全开源】知乎日报UWP版:增加Live磁贴、Badge、以及Toast通知

    目录 说明 实现方法 APP生命期 后台任务 说明 之前网上有人建议增加磁贴(tile).徽章(badge)功能.利用周末的时间,将这两个功能添加上去了.如果将磁贴固定到开始屏幕,磁贴就会循环播放首页 ...

  3. 【完全开源】知乎日报UWP版(上篇):界面设计、官方API分析

    目录 说明 使用Fiddler分析android版API 部分效果图 关于源码 说明 在做博客园UWP版的时候其实就有做知乎日报的打算了,前段时间一直出差,在酒店里用Fiddler简单的分析了一下An ...

  4. 【开源】知乎日报UWP 更新

    说明 大概十天之前我更新了一次APP,后来又仔细看了一下Store里的评论,发现还有几个地方没有改过来.于是前天晚上抽时间改了一下,顺便完善了一下UI体验. 没有看前面文章的童鞋可以看一下下面的链接: ...

  5. 知乎日报win10版 - 天天读报【开源】

    业余时间写的一个知乎日报win10版客户端,支持收藏,评论,点赞等. 商店地址:https://www.microsoft.com/zh-cn/store/apps/%E5%A4%A9%E5%A4%A ...

  6. Win10通用程序 UWP版HtmlAgilityPack UWP应用使用示例

    Win10 UWP版HtmlAgilityPack,UWP应用使用示例下载. Win10 发布了一个多星期,sdk是随着一起发布的,我安装好vs2015和sdk 开发UWP 通用程序. 在做网络解析的 ...

  7. 一个知乎日报pwa

    前几天写了一篇文章关于如何实现一个简单版的pwa应用,端午撸了一个简易版知乎日报pwa. 关于如何写一个pwa,这里就不多介绍了,请移步这里.应用使用vue+vuex+axios,API这里,这里做了 ...

  8. 新浪微博UWP版-实现‘分享功能’的艰难路

    索引 介绍 遇到的问题 寻求帮助 最终的解决方案 最终效果 介绍 在整个Team的共同努力下,在众多WPer的期待下,Weibo UWP版终于正式发布了.有关Weibo UWP版更多的信息请大家参考这 ...

  9. React-Native运行知乎日报遇到的问题

    研究几天RN(React-Native)后,跟着官方的demo做了一下电影图片显示的那个,但是总感觉官方的demo欠缺点什么,所以找来找去找到了RN版的知乎日报,话说知乎日报什么版的都有,不信你们上网 ...

随机推荐

  1. mysql每秒最多能插入多少条数据 ? 死磕性能压测

    前段时间搞优化,最后瓶颈发现都在数据库单点上. 问DBA,给我的写入答案是在1W(机械硬盘)左右. 联想起前几天infoQ上一篇文章说他们最好的硬件写入速度在2W后也无法提高(SSD硬盘) 但这东西感 ...

  2. 小白解决CENTOS7错误:Cannot find a valid baseurl for repo: base/7/x86_6

    刚入手的MacBook想着学点东西,本汪还是决定玩玩CentOS服务器,安装好了VirtualBox + CentOS. 打开一看,懵逼了!命令行! 行吧,先装个图形界面: $sudo yum gro ...

  3. Asp.Net MVC中使用StreamReader读取“Post body”之应用场景。

    场景:有三个市场(Global.China.USA),对前台传过来的数据有些验证需要细化到每个市场去完成. 所以就出现了基类(Global)和派生类(China.USA) 定义基类(Global)Pe ...

  4. 【解决方案】Myeclipse 10 安装 GIT 插件 集成 步骤 图解

    工程开发中,往往要使用到集成GIT ,那么下面说说插件安装步骤 PS:以Myeclipse 10 为例,讲解集成安装步骤. ----------------------main------------ ...

  5. 【Reading Note】Python读书杂记

    赋值 >>> list=[] >>> app=[list,list,list] >>> app [[], [], []] >>> ...

  6. CSS中强悍的相对单位之em(em-and-elastic-layouts)学习小记

    使用相对单位em注意点 1.浏览器默认字体是16px,即1em = 16px,根元素设置如下 html{ font-size: 100%; /* WinIE text resize correctio ...

  7. WINDOWS系统下MYSQL安装过程中的注意事项

    1.首先MySQL的安装方式有两种:一种是MSI安装方式,很简单就像安装Windows软件一样.另外一种就是ZIP安装方式.这种相对而言比较麻烦.新手推荐MSI安装方式. 安装方式有以下两种: MSI ...

  8. 深入学习HBase架构原理

    HBase定义 HBase 是一个高可靠.高性能.面向列.可伸缩的分布式存储系统,利用Hbase技术可在廉价PC Server上搭建 大规模结构化存储集群. HBase 是Google Bigtabl ...

  9. 分享在Linux下使用OSGi.NET插件框架快速实现一个分布式服务集群的方法

    在这篇文章我分享了如何使用分层与模块化的方法来设计一个分布式服务集群.这个分布式服务集群是基于DynamicProxy.WCF和OSGi.NET插件框架实现的.我将从设计思路.目标和实现三方面来描述. ...

  10. 开源一个WEB版本GEF,基于SVG的网页流程图框架

    8月开始断断续续的制作这个web gef,没有任何依赖,完全原生js开发,目前已经完成了雏形,基本上可以在项目里应用了. 下图展示的是demo1的效果,包括拖拽,生成连线,点击生成\取消墙体,整个de ...