站长

<p>预览图：</p>
<p></p><img src="https://img.blogweb.cn/article/fd0866dfdaf746ff8c3536a28257f0c8.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<p></p><img src="https://img.blogweb.cn/article/e6d22c608dd64b5c97931d2ebd038c22.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<p></p><img src="https://img.blogweb.cn/article/b93caa53afaf495eb283ce04d7fed5ff.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<p></p><img src="https://img.blogweb.cn/article/e7f06d0780144c1a9b65384dea5c85e8.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<h4 id="heading-0">开发环境</h4>
<pre class="line-numbers"><code><span>Flutter 1.0.0 • channel stable • https://github.com/flutter/flutter.git</span>
<span>Framework • revision 5391447fae (9 weeks ago) • 2018-11-29 19:41:26 -0800</span>
<span>Engine • revision 7375a0f414</span>
<span>Tools • Dart 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)</span>
</code></pre><h4 id="heading-1">编译运行</h4>
<ol>
<li>
<p>克隆代码</p>
<p>源码地址：<a href="https://github.com/MeandNi/Flutter_ZhiHu" target="_blank">github.com/MeandNi/Flu…</a></p>
</li>
<li>
<p>安装依赖</p>
<pre class="line-numbers"><code><span>flutter packages get</span>
</code></pre></li>
</ol>
<h4 id="heading-2">UI 大致结构</h4>
<p></p><img src="https://img.blogweb.cn/article/763f04a4e4014397b5eebc7880dc6eb2.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<p>采用类似 Android 模块化思想，将整个 App 的内容分为5个部分.</p>
<p></p><img src="https://img.blogweb.cn/article/beadc0a4f9774ad2888bd83c12452dd1.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<h4 id="heading-3">Ui 细节</h4>
<p>暂不叙述，期待后续文章总结。项目目前还在更新完善中，预计使用Redux、Sqlflite等技术栈填充数据部分，本项目部分界面及工具类来自<a href="https://github.com/MeandNi/Flutter_CommonApp" target="_blank">Flutter_CommonApp</a> 。</p>
<h4 id="heading-4">数据结构(结构图壕无专业性可言，仅供观赏😀。)</h4>
<p></p><img src="https://img.blogweb.cn/article/72234ec0308d454290a2c0aac4ba0f42.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<p></p><img src="https://img.blogweb.cn/article/6b3bd09c853f48e3b7590984045b900c.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<p></p><img src="https://img.blogweb.cn/article/646d2c7b7f5e4ba9addd7eedd934e90c.webp" loading="lazy" alt="Flutter知乎App实践：UI+Json+Utils"><p></p>
<h4 id="heading-5">第三方框架</h4>
<table>
<thead>
<tr>
<th>库</th>
<th>功能</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>dio</strong></td>
<td><strong>网络框架</strong></td>
</tr>
<tr>
<td><strong>carousel_slider</strong></td>
<td><strong>轮播图</strong></td>
</tr>
<tr>
<td><strong>cached_network_image</strong></td>
<td><strong>图片加载</strong></td>
</tr>
<tr>
<td><strong>share</strong></td>
<td><strong>链接分享</strong></td>
</tr>
<tr>
<td><strong>flutter_webview_plugin</strong></td>
<td><strong>WebView</strong></td>
</tr>
</tbody>
</table>
<h4 id="heading-6">鸣谢</h4>
<p>感谢那些热爱开源、一起奋斗的朋友们。</p>
<p>值得学习的话，Star哦^_^</p>
<p>GitHub地址：<a href="https://github.com/MeandNi/Flutter_ZhiHu" target="_blank">github.com/MeandNi/Flu…</a></p>


预览图：开发环境编译运行UI大致结构采用类似Android模块化思想，将整个App的内容分为5个部分.Ui细节暂不叙述，期待后续文章总结。项目目前还在更新完善中，预计使用Redux、Sqlflite等技术栈填充数据部分，本项目部分界面及工具类来自。数据结构(结构图壕无专业性可言，仅供观赏😀。)第三方框架鸣谢感谢那些热爱开源、一起奋斗的朋友们。值得学习的话，Star哦^_^GitHub地址：

库	功能
dio	网络框架
carousel_slider	轮播图
cached_network_image	图片加载
share	链接分享
flutter_webview_plugin	WebView