Flutter版本的海外剧

发表于2023-06-29|更新于2024-01-22

|浏览量:

背景

前阵子抓包，有两个海外剧的接口，最近有时间，打算温习一下 Flutter，就用来写了一个简单的 APP，包含轮播图、下拉刷新、上拉加载以及播放功能。

效果如下：

运行时需要注意 Flutter 版本的问题，可能需要修改播放器的 package 中的代码，直接Google 搜索，修改即可，如有疑问可以联系我。

代码放在 Github 上，地址是：meiju_flutter

文章作者: 今是昨非

文章链接: http://morganwang.cn/2023/06/29/meiju_Flutter/

版权声明: 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源今是昨非的博客！

相关推荐

Flutter布局基础——自定义BottomNavigationBar

Flutter布局基础——自定义BottomNavigationBar背景这里我们来尝试实现一个不规则的 BottomNavigationBar，首先了解两个系统组件: floatingActionButton和BottomAppBar floatingActionButtonfloatingActionButton用于创建一个浮动的按钮，有两种样式：一种是圆形的纯图标的；一种是椭圆的带有图标或文案的。示例如下： 123456789101112131415161718192021222324252627282930313233343536373839404142void main() => runApp(const MyApp());/// This is the main application widget.class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); static const String _title = &#x...

Flutter布局基础——Column竖直布局

Flutter布局基础——Column竖直布局Column-是竖直方向布局子视图的Widget，和Row相似，如果想要子视图充满，可使用Expanded把子视图包括起来。 Column不能滑动（通常来说使用Column时，子视图内容不能超过父视图的高度），如果真的有很多子视图，需要滑动的时候，建议使用ListView。如果想要横向布局，使用Row。如果只有一个元素，可考虑使用Align或者Center来布局。基础使用Column常用属性如下： Column常用属性 children: 子视图 textDirection: 子视图水平布局方向 TextDirection.ltr: 从左到右 TextDirection.rtl: 从右到左 verticalDirection: 子视图竖直布局方向 VerticalDirection.down: 从上到下，默认为这个 VerticalDirection.up: 从下到上 mainAxisSize: 子视图在父视图上竖直方向，占用大小 MainAxisSize.min: 最小，设置了这个之后，再设置mainAxisAl...

Flutter环境安装 && 运行

Flutter环境安装 && 运行背景Flutter环境配置到运行，问题备忘记录。比如遇到Android sdkmanager tool not found和Running Gradle task 'assembleDebug'... Flutter安装超级精简版通过homebrew直接安装，可能需要外网 brew install flutter 手动，Flutter环境搭建首先下载Flutter安装包，下载地址：https://flutter.dev/docs/development/tools/sdk/releases?tab=macos 其次，解压已下载文件，把文件放入指定目录中，注意：建议放入可以放入用户根目录下，因为后续需要指定bin文件地址，这个目录最好不会经常变动然后，配置环境变量打开terminal，如果是zsh，输入open .zshrc；（如果是bash，则输入open .baseprofile）在文件末尾添加如下代码，其中pwd为刚刚解压的flutter/bin文件地址， 1export PATH=&quo...

Flutter组件基础——Container

Flutter组件基础——ContainerContainer是容器组件，类似于H5中的标签，亦或者iOS中的UIView，是布局的基础控件。 Container包含属性Container常用属性如下： Container child：子视图 alignment：子视图的对齐方式 topLeft：顶部左对齐 topCenter：顶部居中对齐 topRight：顶部右对齐 centerLeft：中间左对齐 center：中间对齐 centerRight：中间右对齐 bottomLeft：底部左对齐 bottomCenter：底部居中对齐 bottomRight：底部右对齐 color：背景颜色 width：宽度 height：高度 padding：子视图距Container的边距 margin：Container距父视图的边距 decoration：装饰子视图对齐方式-alignment123456789101112131415161718192021222324class MyApp extends StatelessWidget { @overr...

Flutter组件基础——GridView

Flutter组件基础——GridViewGridView是网格布局，类似于iOS中的UICollectionView，可设置每行多少个、单个对象的宽高比、对象水平方向的间距、垂直方向的间距等等。 GridView的常用属性 GridView scrollDirection: 滑动方向 Axis.horizontal: 水平方向滑动 Axis.vertical: 垂直方向滑动，默认为这个。 padding: GridView相对于父视图的边距 crossAxisCount: 每行多少个 mainAxisSpacing: 与滑动方向垂直的方向的间距，eg: 当横向滑动时，这个代表垂直方向对象之间的间距； crossAxisSpacing: 与滑动方向平行的方向的间距，eg: 当横向滑动时，这个代表水平方向对象之间的间距； childAspectRatio：单个元素的宽高比(或者高宽比)，当scrollDirection为vertical时，代表宽高比；当scrollDirection为horizontal时，代表高宽比。简单使用代码如下： 1234567891011...

Flutter组件基础——ListView

Flutter组件基础——ListViewListView是滚动列表，类似于iOS中ScrollView，可横向、纵向滚动，内容不限。 ListView的使用ListView的使用很简单，但是需要多多练习； ListView的使用，通过设置children来实现，children中的Item为Widget对象。纵向滚动代码如下： 123456789101112131415161718192021222324252627282930313233343536373839class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'ListView Learn', home: Scaffold( appBar: new AppBar( tit...