SlidingUpPanel的使用

下载地址:https://github.com/umano/AndroidSlidingUpPanel

最近项目中使用过这种控件,调用的方法expandPanel(float offset);该方法主要设置打开的程度。以此,在背景处并不能响应点击事件,从而使得这个控件收拢,看了看这个View的事件处理方法中,从而获知,其中有一个方法:



private boolean isDragViewUnder(int x, int y) {
View dragView = mDragView != null ? mDragView : mSlideableView;
if (dragView == null)
return false;


int[] viewLocation = new int[2];
dragView.getLocationOnScreen(viewLocation);


int[] parentLocation = new int[2];
this.getLocationOnScreen(parentLocation);


int screenX = parentLocation[0] + x;// 0
int screenY = parentLocation[1] + y;// 113


return screenX >= viewLocation[0]&& screenX < viewLocation[0] + dragView.getWidth()
&& screenY >= viewLocation[1]
&& screenY < viewLocation[1] + dragView.getHeight();
}

通过各种点击,各种Log数据统计,发现该方法是计算一个范围,也就是类似于SlidingUpPanelLayout的底部View的,也就是第二个子View的头的位置范围。至于,怎么调用打开,合并的方法很清晰。在方法中isDragViewUnder的范围很小,在调用expandPanel(float offset)方法打开程度,上面会出现一部分的背景效果,然而,给人的第一操作印象便是点击这一块的背景效果区。至于,合拢的情况下,是没有背景效果区的,完全打开的时候也没有背景效果区,只是在打开成都在(0,1)区间会出现,要想在背景区+第二个子View的头区域中的范围点击效果有效,需要在此方法中再进行一次判断,方法如下:



private boolean isDragViewUnder(int x, int y) {
View dragView = mDragView != null ? mDragView : mSlideableView;
if (dragView == null)
return false;


int[] viewLocation = new int[2];
dragView.getLocationOnScreen(viewLocation);


int[] parentLocation = new int[2];
this.getLocationOnScreen(parentLocation);


int screenX = parentLocation[0] + x;// 0
int screenY = parentLocation[1] + y;// 113


//背景区域+第二个子View的点击。。。
if (isAnchored() && screenX >= viewLocation[0]
&& screenX < viewLocation[0] + dragView.getWidth()
&& y < viewLocation[1] + dragView.getHeight()) {
collapsePane();
return false;
} else {
return screenX >= viewLocation[0]
&& screenX < viewLocation[0] + dragView.getWidth()
&& screenY >= viewLocation[1]
&& screenY < viewLocation[1] + dragView.getHeight();
}
}

可能 y < viewLocation[1] + dragView.getHeight()这个条件不是很完美,但是,功能还是实现了。望赐,更好的处理方式。谢谢!

Flutter 文字轮播图(通常称为文字滚动公告或文本滑动视图)是一种在 Flutter 应用程序展示动态变化的文字信息的组件。它通过循环滚动显示一系列预设的文字字符串,常用于广告、新闻标题或其他需要频繁更新信息的场景。在 Flutter ,你可以使用 `SlidingUpPanel` 或者自定义一个 `StatefulWidget` 结合动画来实现这个效果。例如,可以使用 `AnimatedContainer` 和 `Positioned` 来控制文字的滚动。 以下是一个简单的例子: ```dart import 'package:flutter/material.dart'; class TextCarousel extends StatefulWidget { final List<String> texts; // 需要滚动的文字列表 const TextCarousel({Key? key, required this.texts}) : super(key: key); @override _TextCarouselState createState() => _TextCarouselState(); } class _TextCarouselState extends State<TextCarousel> { int _currentIndex = 0; Duration _animationDuration = Duration(milliseconds: 500); // 滑动速度 void _scrollToNext() { setState(() { if (_currentIndex < widget.texts.length - 1) { _currentIndex++; } else { _currentIndex = 0; } }); } @override Widget build(BuildContext context) { return SlidingUpPanel( panel: Container( child: SingleChildScrollView( padding: EdgeInsets.all(8), child: Column( mainAxisAlignment: MainAxisAlignment.start, children: [ SizedBox(height: kToolbarHeight), ...widget.texts.map((text) { return Padding( padding: EdgeInsets.symmetric(horizontal: 16), child: Text(text, style: TextStyle(fontSize: 16)), ); }).toList(), ], ), ), ), dismissible: false, position: PanelPosition.bottom, height: 100, behavior: SlidingUpPanelBehavior.canSlideVertically, clipBehavior: Clip.none, animationDuration: _animationDuration, onPanelDismissed: () {}, onPanelClosing: (double progress) {}, builder: (context, isClosed) { return IconButton( icon: isClosed ? Icon(Icons.arrow_downward) : Icon(Icons.close), onPressed: isClosed ? () {} : _scrollToNext, tooltip: isClosed ? "展开" : "关闭", ); }, ); } } ```
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值