目录

说明

上一篇博客将源码放出来了,但是并没有做过多的介绍,所以如果自己硬看可能需要花费很长的时间,尤其这些代码并不是自己写的。项目不算复杂但是也不算简单,这篇文章我尽我所能将整个项目结构、关键的代码全部解释一下,希望能给对本项目感兴趣的童鞋、以及那些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. 重撸js_2_基础dom操作

    1.node 方法 返回 含义 nodeName String 获取节点名称 nodeType Number 获取节点类型 nodeValue String 节点的值(注意:文本也是节点) 2.inn ...

  2. 如何快速优化手游性能问题?从UGUI优化说起

    WeTest 导读   本文作者从自身多年的Unity项目UI开发及优化的经验出发,从UGUI,CPU,GPU以及unity特有资源等几个维度,介绍了unity手游性能优化的一些方法.   在之前的文 ...

  3. [干货来袭]C#6.0新特性

    微软昨天发布了新的VS 2015 ..随之而来的还有很多很多东西... .NET新版本 ASP.NET新版本...等等..太多..实在没消化.. 分享一下也是昨天发布的新的C#6.0的部分新特性吧.. ...

  4. PHP设计模式(八)桥接模式(Bridge For PHP)

    一.概述 桥接模式:将两个原本不相关的类结合在一起,然后利用两个类中的方法和属性,输出一份新的结果. 二.案例 1.模拟毛笔(转) 需求:现在需要准备三种粗细(大中小),并且有五种颜色的比 如果使用蜡 ...

  5. Apache Cordova开发Android应用程序——番外篇

    很多天之前就安装了visual studio community 2015,今天闲着么事想试一下Apache Cordova,用它来开发跨平台App.在这之前需要配置N多东西,这里找到了一篇MS官方文 ...

  6. nexus 社区版3.0.2部署、访问

    下载nexus社区办(oss): https://www.sonatype.com/download-oss-sonatype 目前最新版本  nexus-3.0.2-02-win64.zip nex ...

  7. 图解Spark API

    初识spark,需要对其API有熟悉的了解才能方便开发上层应用.本文用图形的方式直观表达相关API的工作特点,并提供了解新的API接口使用的方法.例子代码全部使用python实现. 1. 数据源准备 ...

  8. firebug不能加载JS文件 ,无法进行JS脚本调试

    提示: 本页面不包含 Javascript 如果 <script> 标签有 "type" 属性,其值应为 "text/javascript" 或者& ...

  9. [转]thinkphp 模板显示display和assign的用法

    thinkphp 模板显示display和assign的用法 $this->assign('name',$value); //在 Action 类里面使用 assign 方法对模板变量赋值,无论 ...

  10. innodb 自增列重复值问题

    1 innodb 自增列出现重复值的问题 先从问题入手,重现下这个bug use test; drop table t1; create table t1(id int auto_increment, ...