- 博客(62)
- 资源 (1)
- 收藏
- 关注
原创 Flutter-自适用高度PageView
通过本方案,我们实现了一个自适应高度的PageView,它能够根据每个页面的内容高度进行动态调整。该实现依赖于对每个页面内容的测量,并使用来平滑地过渡高度变化。这样可以确保页面切换时,用户体验更加自然流畅,避免了内容被裁剪或空白区域的出现。这种自适应高度的PageView非常适合用于不同页面内容高度不一致的场景。详情:github.com/yixiaolunhui/flutter_xy。
2024-08-18 12:37:36
506
原创 Android-自适用高度的ViewPager
自定义的 PagerAdapter 必须实现一个接口,用于获取指定位置页面的 View,这样我们可以测量页面内容的高度。通过自定义 ViewPager 的动态高度适配功能,我们可以解决内容高度不一致导致的布局问题。这种方案可以适应不同页面内容的高度变化,实现平滑的过渡效果,非常适用于动态内容展示的场景。
2024-08-15 22:32:47
673
原创 Flutter-实现物理小球碰撞效果
在Flutter应用中实现物理动画效果,可以大大提升用户体验。本文将详细介绍如何在Flutter中创建一个模拟物理碰撞的动画小球界面,主要代码实现基于集成。插件来获取设备的加速度传感器数据。希望这篇博客能对您在Flutter开发中实现类似效果有所帮助。通过这篇博客,我们展示了如何在Flutter中实现一个物理球动画效果,并且集成了。详情见:github.com/yixiaolunhui/flutter_xy。插件来获取设备的加速度传感器数据。在开始之前,请确保在。
2024-07-10 00:56:34
465
原创 Flutter-实现悬浮分组列表
在本篇博客中,我们将介绍如何使用 Flutter 实现一个带有分组列表的应用程序。我们将通过和Sliver组件来实现该功能。
2024-07-07 13:42:21
453
原创 Flutter-实现双向PK进度条
在Flutter应用中,进度条是一个非常常见的组件。而双向PK进度条则能够展示两个对立的数值,如对战中的双方得分对比等。本文将介绍如何实现一个具有双向PK效果的进度条,并支持竖直和斜角两种过渡效果。
2024-07-06 22:37:06
395
原创 Flutter实现仿微信群头像功能
通过上述实现,我们成功地在Flutter中创建了一个仿微信群头像的控件。这个控件不仅可以动态调整布局,还支持网络图片的缓存和占位符显示。希望这篇文章对你在Flutter项目中实现类似功能有所帮助。如果你有任何问题或建议,欢迎访问我的GitHub项目:github.com/yixiaolunhui/flutter_xy与我交流。在Flutter项目中,实现一个类似于微信群头像的控件。该控件能够显示多个头像图片,并且根据图片的数量,自动调整布局,确保每个图片都是正方形,且有统一的边框和间距。
2024-06-23 18:53:07
252
原创 Flutter-实现头像叠加动画效果
在这篇文章中,我们将介绍如何使用 Flutter 实现一个带有透明度渐变效果和过渡动画的头像叠加列表。通过这种效果,可以在图片切换时实现平滑的动画,使 UI 更加生动和吸引人。
2024-06-22 19:29:30
773
原创 Flutter-无限循环滚动标签
在现代移动应用开发中,滑动视图是常见的交互模式之一。特别是当你需要展示大量内容时,使用自动滚动的滑动视图可以显著提升用户体验。在这篇文章中,我们将讨论如何使用 Flutter 实现一个自动滚动的列表视图。详情:github.com/yixiaolunhui/flutter_xy。
2024-06-19 23:55:56
489
原创 Android采用Scroller实现底部二楼效果
通过上述代码,我们成功实现了底部二楼效果。在用户滑动到RecyclerView底部时,可以继续向上拖动以显示底部的内容区域。这种效果可以增强用户体验,增加更多的内容展示方式。通过自定义布局和使用Scroller类,我们可以轻松实现这种复杂的滑动效果。在移动应用开发中,有时我们希望实现一种特殊的布局效果,即“底部二楼”效果。这个效果类似于在列表底部拖动时出现额外的内容区域,用户可以继续向上拖动查看更多内容。这种效果可以用于展示广告、推荐内容或其他信息。为了实现这一效果,我们可以自定义一个。
2024-06-15 15:39:06
579
原创 Flutter-自定义可展开文本控件
通过以上实现,我们可以轻松地在Flutter应用中使用可展开和收起的文本控件,提升用户体验。这种实现方式不仅简洁高效,还具备良好的可维护性和扩展性。如果你有更复杂的需求,可以在此基础上进行进一步的定制和优化。详情见:github.com/yixiaolunhui/flutter_xy。
2024-06-02 01:32:42
704
原创 Flutter-自定义折叠流布局实现
该折叠流布局可以显示一组标签,并在标签数量超过指定行数时提供展开和收起功能。初始状态下只显示限定行数的标签,并在最后一个位置显示展开按钮。点击展开按钮可以显示全部标签,再次点击展开按钮可以收起标签。在 Flutter 开发中,常常需要实现自定义布局以满足不同的需求。本文将介绍如何通过自定义组件实现一个折叠流布局,该组件能够显示一系列标签,并且在内容超出一定行数时,可以展开和收起。来控制标签的布局和展开收起的逻辑。通过上述代码,我们实现了一个自定义的折叠流布局组件。下面是完整的实现代码,包括。
2024-05-26 14:45:03
443
原创 Android-自定义三角形评分控件
首先,创建一个自定义View类TriangleRatingAnimView,用于绘制三角形和动画效果。/*** 三角形评分控件*/= null,init {// 绘制外部三角形close()// 绘制顶点到重心的连线// 绘制内部动态三角形close()// 绘制动态点上的空心圆
2024-05-19 00:22:59
364
原创 Flutter-自定义三角形评分控件
在移动应用开发中,显示数据的方式多种多样,直观的图形展示常常能带给用户更好的体验。本文将介绍如何使用Flutter创建一个自定义三角形纬度评分控件,该控件可以通过动画展示评分的变化,让应用界面更加生动。通过以上步骤和代码,我们可以创建一个带动画效果的三角形纬度评分控件,使评分展示更加生动和直观。详情可见:github.com/yixiaolunhui/flutter_xy。
2024-05-18 21:31:38
183
原创 AndroidStudio Maven库下载400失败的问题
上面案例只是一种场景,只要是maven下载出现类似Could not GET,很有之前可能配置过Http Proxy代理导致中招的。到你电脑的gradle缓存目录中,删除gradle.properties文件,然后重新build。
2024-05-10 12:31:12
353
1
原创 Flutter弹窗链-顺序弹出对话框
弹窗的顺序执行在App中是一个比较常见的应用场景。比如进入App首页,一系列的弹窗就会弹出。如果不做处理就会导致弹窗堆积的全部弹出,严重影响用户体验。如果多个弹窗中又有判断逻辑,根据点击后需要弹出另一个弹窗,这个弹窗优先级更高,需要在当前弹出框关闭后弹出,又添加了复杂度了,所以才会有需要管理多个弹窗的展示需求。
2024-05-07 17:26:56
662
原创 Flutter-自定义画板
详情见 github.com/yixiaolunhui/flutter_xy。定义画板类DrawingBoard。定义工厂类 factory。实现线、圆、矩形绘制。
2024-04-24 12:22:45
542
原创 Flutter仿Boss-6.底部tab切换
心想难道有缓存,想当然就给Image定义了key,每次点击按钮给Image设置不同的key,运行发现还是不行,到这一步只好谷歌大法了,看到了很多人遇到这个问题,但是没有给出解决的答案,看来只能源码大法了。然后发现Image中有内存缓存ImageCache,翻看了源码后发现了解决方案,因为这里我不需要内存缓存,而且这个缓存与Image中的bundle有关系,只要每次创建Image设置不同的bundle就OK了,所以我就把代码尝试修改了下。问题:Flutter加载webp再次加载无法再次播放动画问题。
2024-04-09 22:22:23
582
原创 Flutter仿Boss-5.Lottie实现的Tab切换
详情:github.com/yixiaolunhui/flutter_project。根据自己项目适配的Flutter版本引入对应的Lottie版本。
2024-04-05 21:30:11
492
原创 Flutter仿Boss-4.短信验证码界面
进行状态管理和简单的UI布局,用户可以轻松地输入和验证他们的验证码。这个界面是任何需要通过短信进行用户身份验证的移动应用的重要部分。您可以进一步增强这个界面,例如添加错误处理、UI动画,或者与后端服务集成进行实际的短信验证。在移动应用开发中,处理短信验证码是确保用户身份验证和安全性的重要步骤。本文将介绍如何使用Flutter构建一个短信验证码界面,让用户输入通过短信发送到他们手机的四位验证码。它管理状态、控制验证码过期的计时器,并处理验证码验证。是用户与验证码界面进行交互的UI组件。
2024-04-04 23:08:54
719
原创 Flutter-发布插件到pub上传不上问题
问题1解决后,进入验证身份,点击终端显示的链接,跳转到google验证,记得这里要科学上网,点击确定认证后,发现一直卡在下图。复制上面的指令在android studio终端terminal中执行。然后再重新执行发布命令。然后把下面命令端口号换成你的端口号,我这里是7890。根据粘贴出来的知道代理端口号为:7890。
2024-04-03 21:17:00
467
原创 Flutter仿Boss-3.登录页
在Flutter应用程序中创建登录页面对于用户认证和参与至关重要。登录页面作为用户访问应用程序功能的入口。它应该提供无缝的体验,同时确保安全和隐私。这里仿Boss应用设计的登录页面,我们将创建一个登录页面,允许用户使用手机号码登录或注册。
2024-04-02 15:18:37
575
原创 Android仿高德首页三段式滑动
最近发现很多app都使用了三段式滑动,比如说高德的首页和某宝等物流信息都是使用的三段式滑动方式,谷歌其实给了我们很好的2段式滑动,就是BottomSheet,所以这次我也是在这个原理基础上做了一个小小的修改来实现我们今天想要的效果。
2024-04-01 14:30:17
811
原创 Flutter仿Boss-2.启动页、引导页
中,我们展示了一个PageView来滑动展示多个引导页内容。在底部我们放置了两个按钮,分别用于“我要招人”和“我要应聘”,点击按钮后跳转到首页。在移动应用开发中,启动页和引导页是用户初次接触应用时的重要组成部分,能够提升用户体验和导航用户了解应用功能。通过以上的实现,我们完成了Flutter仿Boss应用的启动页和引导页功能,帮助用户更好地了解应用,并提供了快速导航到首页的功能。在逻辑部分,我们设置了一个计时器,3秒后自动跳转到首页/登录页。引导页用于向用户介绍应用的功能和特点,帮助用户快速上手。
2024-04-01 13:25:28
709
原创 Flutter仿Boss-1.启动黑白屏问题
在使用Flutter开发App应用时,运行在Android手机启动时可能会遇到应用显示黑白屏的问题。这个问题做过Android开发的人员都知道,在Android12版本兼容中新增改用SplashScreen API定制系统启动画面,但是本文将介绍如何通过调整启动样式配置解决这个问题。请注意,这里的配置文件决定了启动时的主题样式,包括背景颜色和图标等。中正确引用,我们可以让应用在启动时呈现出预期的样式,提升用户体验。指定了启动屏幕的背景,确保其引用了我们之前配置的。属性,确保启动时使用了我们修改后的样式。
2024-04-01 12:25:41
593
原创 Flutter环境搭建及版本管理
Flutter已成为移动应用开发的主流选择,其跨平台优势日益凸显,使学习Flutter成为现代开发者的必备技能。越来越多的公司和团队选择Flutter构建应用,这为开发者提供了更广阔的就业机会和职业发展空间。Flutter的热度源自其强大的特性和生态系统支持,包括快速的开发周期、高性能的渲染引擎、丰富的UI组件和易学的Dart编程语言。此外,Flutter不仅适用于移动应用开发,还可用于桌面和Web应用,为开发者提供了更多创作空间和机会。
2024-03-29 16:52:55
1342
原创 Flutter-实现扫描线移动效果
通过本文的介绍,您学会了如何在Flutter中创建一个扫描线移动效果的控件。通过使用动画控制器和动画构建器,我们可以轻松地实现各种动画效果,为应用程序增添动感和生机。
2024-03-19 14:47:01
753
原创 Android仿高德首页三段式滑动
最近发现很多app都使用了三段式滑动,比如说高德的首页和某宝等物流信息都是使用的三段式滑动方式,谷歌其实给了我们很好的2段式滑动,就是BottomSheet,所以这次我也是在这个原理基础上做了一个小小的修改来实现我们今天想要的效果。我们实现的效果和高德差距不是很大,也很顺滑。具体实现其实就是集成CoordinatorLayout.Behavior。对于按钮滑动及通明度渐变隐藏显示也是通过实现behavior,因为比较的简单直接上代码。好了,话不多说,一笑轮回~~~~~
2024-03-18 09:24:41
543
原创 Android仿智联详情
根据上面的分析,主要的功能其实就是这个“在招职位”布局的收起和展开,默认收起,然后手势控制展开。很久没有发文章了,这一年多一直在卷。代码其实还是比较少的,其实主要是通过监听拖动来设置“在招职位”布局距离左边的margin值就可以了,希望能对新入手的同学有点帮助,我也算复习了下。3、“在招职位”布局支持手势拖动,向上时布局距离屏幕左边越来越近(最终距离屏幕左边距离为0),向下时布局距离越来越远(最终是屏幕的宽度的一半)。1、刚进入界面时,“在招职位”布局在底部露头,并距离屏幕左边一半屏幕宽度的距离。
2024-03-18 09:23:32
259
2
原创 Flutter-自定义表情雨下落动画
gpt第一次回答你的代码其实已经告诉你实现思路了,比如上面的代码,通过gpt的回答我们知道可以使用Stack控件,然后在Stack中添加我们想要的数量的表情widget,然后通过AnimatedBuilder+Positioned实现表情下落的效果。下面是我修改后的完整代码。我们如何去问gpt,才能让gpt给出我们想要的结果呢?但是现在我们不是单纯的搜关键字了,而是用自己的语言把效果用话语表达出来,让gpt知道到底怎么写代码,总结来说你就是产品,gpt是开发人员,你要把产品需求告诉gpt去开发。
2024-03-18 09:21:24
590
原创 Flutter-底部弹出框(Widget层级)
想到这里我们其实会想到一个控件DraggableScrollableSheet,Flutter提供一种可以支持在widget中引入的底部弹出布局,同时不影响其他的操作,所以我就使用这个控件测试了下,发现一个问题,就是当底部弹出框内容为上面有个头部,底部是个列表时,每次都需要列表滑动到顶部的时候才可以手势滑动关闭,所以需要支持触摸顶部布局也支持手势滑动关闭,所以在此控件上做一个修改。完整代码见:https://github.com/yixiaolunhui/flutter_xy。
2024-03-18 09:20:44
1821
原创 Flutter-仿腾讯视频Banner效果
没有听错,发毕业证的当天上午刚讨论完需求,中午吃完饭,正常去公司前面的小公园溜达,没想到,从天而降的暗器打到我的手臂上,我下意识一跺脚,发出一声”我靠“。这两天看不下去八股文,就想先休息几天追追剧,打开腾讯视频看看动漫,发现腾讯视频的顶部banner效果满新颖的,处于个人爱好,就简单实现了下这个效果,不过我在此基础上加了一些修改。好了就这样吧,如有发现bug,自己慢慢修改下就行了,毕竟没有项目使用过,懒得写结尾了,我去追剧了。因为没多少代码,比较的简单,几分钟搞定,也懒得写实现原理了,直接一把嗦上代码。
2024-03-18 09:19:51
650
原创 Flutter如何正确使用图片资源
但是没有解决问题2,如果开发人员勿删还在使用的图片资源时,编译是不会报错的,运行也是没有问题的,只有到使用此图片资源的界面才会发现错误,导致bug出现。如果自己不擅长写脚本可以通过chatgpt来实现,很简单的,只要把自己的需求告诉他就可以了。我们可以参考android资源的使用方式,在Android中使用资源文件都是 R.id.xxxx来引用的,那么我们是否也可以让Flutter也类似这么使用呢?如果删除了图片,更新脚本后,原来使用的地方会编译报错,这样开发人员就知道了,避免了bug产生。
2024-03-18 09:19:17
504
原创 Flutter-数字切换动画
具体见github:github.com/yixiaolunhui/flutter_xy。主要采用AnimatedSwitcher实现需求,代码比较简单,直接撸。
2024-03-18 09:18:33
550
原创 Flutter路由跳转参数处理小技巧
settings.arguments获取数据,那么我们直接在 initState方法中直接通过 ModalRoute.of(context)?我们在开发应用中,经常会出现一个界面跳转到另外一个界面并带有参数传递,在Android中大家都知道使用Intent传递参数,在第二个Activity中onCreate中可以获取到这个参数。那么在Flutter中,我们经常会使用路由跳转到另外一个界面,那么如果这个时候需要传参。我们有的时候需要在initState方法中获取数据并处理一些事情,我们应该怎么做呢?
2024-03-18 09:17:30
430
原创 Flutter生命周期方法小技巧
我们在使用Flutter开发界面时,很多时候是需要在当前界面切换到后台,或者说当前界面跳转到第二个页面时,需要处理一些事宜,比如说音乐暂停,视频暂停等等。所以我们需要自己搞一下,搞一下这2个方法出来,只要在这2个方法中处理便可以满足上面的需求。onStart和onStop 这里就不做添加了,以上4个方法便可以完成需求。场景2:A界面点击按钮跳转到B界面。场景3:B界面点击返回到A界面。场景5:A界面后台切换到前台。创建2个widget界面。场景4:A界面切换到后台。场景6:A界面弹出对话框。
2024-03-18 09:14:29
603
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人