展开

关键词

你知道吗,Flutter内置了10多种show

barrierColor:背景颜色transitionDuration:画时长,transitionBuilder是构建进出画,默认画是渐隐渐显,构建缩放画代码如下:showGeneralDialog applicationLegalese:著作权(copyright)提示。children:位置如上图红蓝绿色位置。所有属性都需要手设置,不是自获取。 showBottomSheet在最近Scaffold父组件上展示一个material风格bottom sheet,位置同Scaffold组件bottomSheet,如果Scaffold设置了bottomSheet context) { return BottomSheet(...); });效果如下:设置背景、阴影、形状:showModalBottomSheet( context: context, backgroundColor isScrollControlled参数指定是否使用可拖组件,如果子组件是ListView或者GridView,此参数应该设置为true,设置为true后,最大高度可以占满全屏。

57811

Android材料设计之FloatingActionButton+Snackbar+SheetX3

本文把几个小东西讲一下 FloatingActionButton:浮按钮 Snackbar:底弹框 BottomSheet:底抽屉 BottomSheetDialog :抽屉对话框 BottomSheetDialogFragment :抽屉对话框Fragment ----一、FloatingActionButton1.基本认知 :FloatingActionButton何许人也? fab挂接.gif----二、Snackbar和FloatingActionButton联 Snackbar感觉就像下面出来Toast,只是可以交互而已 ? :要留多长头在外面(也就是说,至少给个抽屉把手吧) 2.直接内嵌如CoordinatorLayout FloatingActionButton---同上 3.状态监听1).五种状态,见下:看图应该挺清楚 BottomSheet?

31530
  • 广告
    关闭

    90+款云产品免费体验

    提供包括云服务器,云数据库在内的90+款云计算产品。打造一站式的云产品试用服务,助力开发者和企业零门槛上云。

  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    touch-action导致页面无法

    什么呢?就是ios基本都可以,但是页面都没了。这是为什么呢?这个就要看下touch-action更官方触摸说明了。 默认情况下,平移()和捏手势由浏览器独占处理。 这就是上无法页面原因。为什么ios没有受影响呢,我觉得可能是ios默认支持touch事件原因吧。如果你知道底层原因或者详细文档说明,可以告诉我哦。 – 拿到后冷静分析,拿到这个不要过于着急,还是要分析下产生原因,尤其是机型,因为我们之前做测试都是模拟器和苹果ios,而这次报都是机型,而且是小米56,坚果,华为等。 联想到这些机型,那么定位到可能是 :代码兼容部分版本过低,这些不支持;代码某部分是对ios和有区分解释,和系统有关,版本无关。更多延伸与拓展通过touch-action可以做什么效果呢? :如果你想更好使用相关体验,还是入手框架吧,不然坑太多,iscroll,better-scroll(一般组件依赖库).me-scroll(个人推荐)都是不错选择 – 利一篇还不错采坑文章

    2.6K00

    字幕以及TextSwitcher、ImageSwitcher使用

    4.酷炫切换效果setInAnimation()setOutAnimation()竖直字幕效果? ** * 自垂直TextView *public class AutoVerticalScrollTextView extends TextSwitcher implements ViewSwitcher.ViewFactory ){ Rotate3dAnimation rotation = new Rotate3dAnimation(turnIn, turnUp); rotation.setDuration(1200);执行时间 rotation.setFillAfter(false);是否保持画完毕之后状态 rotation.setInterpolator(new AccelerateInterpolator());设置加速模式 ,向上翻页 public void next(){ 显示画 if(getInAnimation() !

    1.1K30

    你知道吗,Flutter内置了10多种show

    barrierColor:背景颜色transitionDuration:画时长,transitionBuilder是构建进出画,默认画是渐隐渐显,构建缩放画代码如下:showGeneralDialog applicationLegalese:著作权(copyright)提示。children:位置如上图红蓝绿色位置。所有属性都需要手设置,不是自获取。 showBottomSheet在最近Scaffold父组件上展示一个material风格bottom sheet,位置同Scaffold组件bottomSheet,如果Scaffold设置了bottomSheet isScrollControlled参数指定是否使用可拖组件,如果子组件是ListView或者GridView,此参数应该设置为true,设置为true后,最大高度可以占满全屏。 如果有,请在文章底部留言和点赞,以表示对我支持,你们留言、点赞和转发关注是我持续更新力!

    26610

    BottomSheet底部作条使用

    底部作条 底部作条(Bottom Sheets)是一个从屏幕底部边缘向上滑出一个面板,使用这种方式向用户呈现一组功能。底部作条呈现了简单、清晰、无需额外解释一组操作。 使用环境底部作条(Bottom Sheets)特别适合有三个或者三个以上操作需要提供给用户选择、并且不需要对操作有额外解释情景。 行为显示底部作条时候,画应该从屏幕底部边缘向上展开。根据上一步内容,向用户展示用户上一步操作之后能够继续操作内容,并提供模态选择。点击其他区域会使得底部作条伴随下滑画关闭掉。 如果这个窗口包含操作超出了默认显示区域,这个窗口需要可以滑。滑操作应当向上拉起这个作条内容,甚至可以覆盖整个屏幕。当窗口覆盖整个屏幕时候,需要在上部栏左侧增加一个收起按钮。 , float slideOffset) { 这里是拖拽中回调,slideOffset为0-1 完全收起为0 完全展开为1 } }); }}当然BottomSheet这种效果是高度可扩展,你可以在布局中实现你想要任何效果

    70080

    Chrome条透明

    在做一个小应用时候,给一个面板设置了透明度(opacity:.9),在浏览页面时候,发现条居然透明了,如下图所示:? 然后想是不是可以使用自定义来解决这个,找到这篇文章--《不用装扩展也可自定义Chrome样式》::-webkit-scrollbar-track-piece{ background-color :-webkit-scrollbar-thumb:hover{ height:50px; background-color:#9f9f9f; -webkit-border-radius:4px;}现在效果

    1.1K10

    挥别web移端开发差异和经典坑

    端click屏幕产生200-300 ms延迟,PC端无描述:移设备上web网页是有300ms延迟,往往会造成按钮点击延迟甚至是点击失效。 解决:fastclick可以解决在手机上点击事件300ms延迟zeptotouch模块,tap事件也是为了解决在click延迟iOS上拉边界下拉出现空白,无描述:手指按住屏幕下拉,屏幕顶部会多出一块白色区域 document.activeElement.scrollIntoViewIfNeeded(false) } }, 0) }})onkeyUp和onKeydown兼容差异用 input 监听键盘 keyup、keydown事件,在手机浏览器中没有 KB数有误描述:虽然官方文档说 setData 设置数据时候不能超过1024KB,小程序在IOS下单次设置数据不能超过1024kB ,设置会有;时间:201908IOS系统微信版本兼容描述 :201908部分机器点击键盘发送相同内容描述:部分机,如oppo 快速点击键盘发送,会发出2条一样内容,防抖与节流均不生效;时间:201907微信公众号在微信授权回调带#URL跳转会出现空白描述

    23920

    建站四部曲之移端篇(Android+上线)

    上线)----零、前言 本系列为了总结一下手上知识,致敬我2018 本篇重点在于:后端数据在移展现 本篇总结技术点: 材料设计串烧、Retrofit+RxJava访请求、MVP模式思考 ,核心是中间,左边顺带用一下NavigationView 中间主页面由AppBarLayout+CollapsingToolbarLayout+Toolbar祖孙三人打头阵 中间主由RecyclerView }----3.4:BottomSheet与FloatingActionButton结合mBottomSheetBehavior = BottomSheetBehavior.from(mBottomSheet isOpen;});----4.伴随移Behavior? BottomVerticalScrollBehavior { public BnbFollowListBehavior(Context context, AttributeSet attributeSet) { super(); }}推荐想看起

    25110

    我在移web开发中遇到各种

    web app中有横向(水平需求时,有时候不能横向? (在pc和ios中都能流畅地) 目前(2015年8月3日15:02:24)在大部分手机都发现这个,触发bug条件知道了,但是原因未知。 我是横向文字, 我是横向文字, 我是横向文字, 我是横向文字, 我是横向文字, 我是横向文字, 我是横向文字, 如上html,如果把divheight: 500px ;overflow: auto;去掉,纵向层是body,此时是正常中ul能正常地左右。 2、保证数据量不会造成纵向也行。 但是做web app,不能保证时时都能直接用body作为,尤其是在弹窗中时候,请有更好,不使用js解决方法吗?

    24020

    《云阅》一个仿网易云音乐UI,使用Gank.Io及豆瓣Api开发开源项目

    项目采取是Retrofit + RxJava + MVVM-DataBinding架构开发。开发中所遇到各种已归纳在这里。 大: 显示全部资讯。支持下拉刷新方便查看最新资源。电影(豆瓣) API是豆瓣提供,因为限制了每个ip每分钟请求次数,所以请酌情使用,由此带来不便请见谅。 玩: 显示玩轮播图及最新内容。 段子: 显示内涵段子和糗事百科段子内容。 书籍: 检索豆瓣心理学类书籍并展示。 扫码下载:扫码即可下载App,帮助您快速试用~ 反馈:常见归纳,反馈地方,联系方式都在这里哦! download.png宝贵意见如果有任何,请到githubissue处写上你不明白地方,也可以通过下面提供方式联系我,我会及时给予帮助。另外常见已总结在这里。

    48110

    原生JS解决 机 inputtextarea输入键盘遮盖输入框

    描述:h5开发时,inputtextarea输入框在手机中,获取焦点时,键盘会直接在页面上方弹出,如果你输入框刚好在页面下方就会被弹出键盘遮挡,也无法向上滑使其显示,如下图所示:?? 解决思路:0.首先需要判断当前机型是否为机(避免影响IOS端)判断是否是还是iosisAndroid() { let u = navigator.userAgent; let isAndroid 也是同样 2.当输入框获得焦点时,让页面条至最底部:键盘遮挡输入onFocusAddr() { if (! isAndroid()) return;判断是否是机 setTimeout(() => { let div = document.getElementById(root);获取根节点 div.scrollTop = div.scrollHeight;条至底(这里没有写很严谨,需要减去输入框自身高offsetHeight,效果都一样) }, 500);键盘拉起延迟时间}解决,效果如下图:?

    1.1K40

    调试集锦

    1、在AndroidManifest.xml文件中修改项目版本号,即设置android:versionCode和android:versionName时,当手机上装文件没有卸载时,versionName 和versionCode只能由小变大时才会正常装,当versionName和versionCode小于手机上该App对应版本号时,App将无法部署到手机上进行调试,将会弹出如下图所示装错误提示 例如我手机上之前版本是2.0,然后我装后不卸载,直接准备将相同App版本号为1.0App部署到手机上进行调试时会出现这样。?而当手机上App卸载后,则不受这一限制。

    329100

    微信H5页面兼容性解决方案

    1、ios端兼容input光标高度详情描述:input输入框光标,在手机上显示没有,但是在苹果手机上当点击输入时候,光标高度和父盒子高度一样。 、页面缺失详情描述:在ios端,上下滑页面时,如果页面高度超出了一屏,就会出现明显卡顿,页面有部分内容显示不全情况,例如下图,右图是正常页面,左边是ios上下滑后,卡顿导致如左图下面部分丢失 ios里,收起键盘时候会被顶上去,特别是第三方键盘4、弹出键盘遮盖文本框详情描述:微信H5弹出软键盘后挡住input输入框,如下左图是期待唤起键盘时候样子,右边是实际唤起键盘样子? 0.5秒,因为调用键盘有一点迟钝,导致如果不延时处理话,就失效了changefocus(){ let u = navigator.userAgent, app = navigator.appVersion 但如果该元素已经在浏览器窗口可见区域内,则不会发生5、Vue中路由使用hash模式,开发微信H5页面分享时在上设置分享成功,但是ios分享异常详情描述:ios当前页面分享给好友,点击进来是正常

    1.3K43

    微信 H5 页面兼容性解决方案

    1、ios端兼容input光标高度详情描述:input输入框光标,在手机上显示没有,但是在苹果手机上当点击输入时候,光标高度和父盒子高度一样。 、页面缺失详情描述:在ios端,上下滑页面时,如果页面高度超出了一屏,就会出现明显卡顿,页面有部分内容显示不全情况,例如下图,右图是正常页面,边是ios上下滑后,卡顿导致如左图下面部分丢失。 ios里,收起键盘时候会被顶上去,特别是第三方键盘4、弹出键盘遮盖文本框详情描述:微信H5弹出软键盘后挡住input输入框,如下左图是期待唤起键盘时候样子,右边是实际唤起键盘样子? 0.5秒,因为调用键盘有一点迟钝,导致如果不延时处理话,就失效了changefocus(){ let u = navigator.userAgent, app = navigator.appVersion 但如果该元素已经在浏览器窗口可见区域内,则不会发生 5、Vue中路由使用hash模式,开发微信H5页面分享时在上设置分享成功,但是ios分享异常详情描述:ios当前页面分享给好友,点击进来是正常

    69330

    【H5】344- 微信 H5 页面兼容性解决方案

    1、ios端兼容input光标高度详情描述:input输入框光标,在手机上显示没有,但是在苹果手机上当点击输入时候,光标高度和父盒子高度一样。 、页面缺失详情描述:在ios端,上下滑页面时,如果页面高度超出了一屏,就会出现明显卡顿,页面有部分内容显示不全情况,例如下图,右图是正常页面,边是ios上下滑后,卡顿导致如左图下面部分丢失。 ios里,收起键盘时候会被顶上去,特别是第三方键盘4、弹出键盘遮盖文本框详情描述:微信H5弹出软键盘后挡住input输入框,如下左图是期待唤起键盘时候样子,右边是实际唤起键盘样子? 0.5秒,因为调用键盘有一点迟钝,导致如果不延时处理话,就失效了changefocus(){ let u = navigator.userAgent, app = navigator.appVersion 但如果该元素已经在浏览器窗口可见区域内,则不会发生 5、Vue中路由使用hash模式,开发微信H5页面分享时在上设置分享成功,但是ios分享异常详情描述: ios当前页面分享给好友,点击进来是正常

    34830

    SAUI-关于input

    关于form表单,貌似很多时候都会遇到。比如,如下: image.png 尤其在textarea上,好像更是严重。 在这我解决办法如下:1 页面用scroll-view,通过变量{sysScroll}来控制view: form>scroll-view>js: onfocus: function() { this.setData ({sysScroll: false}) }, onblur: function (e, param, inst) { this.setData({sysScroll: true}) } 2 去掉父级overscroll 貌似所有都不见了。经ios+andriod各一台手机测试 最后有兴趣同学,可以扫以下二维码~~~ image.png

    13720

    开发遇到奇葩

    第一个:R cannot be resolved to a variable来自网络:Android开发过程中,碰到R cannot be resolved to a variable报错信息,好像没有很确定错误原因 文件手写添加一个控件,看id能否在R.java中自生成,如果不能,那很大可能就是这个layout xml文件有,查看格式是否使用正确,或者包含什么非法字符串,或者调用到了不正确字符串,等等,可以使用排除法 ,挨个去掉控件,直到发现error message消失或者id能在R.java中自生成。 7.删掉gen文件夹,使R.java重新自生成一次,如果不能生成,继续检查layoutxml文件是否有如上不易发觉 8.Clean project ,重新build,或者重新import project 9.重启eclipse 10.重启电脑,以防Android 虚拟机第二个:Unknown error: Unable to build: the file dx.jar was not loaded

    48160

    Flutter中操作提示

    但是在开始今天内容之前,我们还是需要把昨天留下解决下。? 在原生客户端有着几种常用用户提醒方式,如Dialog、Snackbar、BottomSheet等,今天我们就来介绍下Flutter中几种常用提醒方式。 this.backgroundColor,背景this.action,其他操作this.duration: _kSnackBarDisplayDuration,显示时长this.animation,进出画 还是来看下构造方法:const SimpleDialog({Key key,this.title,标this.titlePadding,标paddingthis.children,内容this.contentPadding 这两种方法都可以显示BottomSheet,只不过第一个是从新打开了一个界面来显示,第二个方法是直接在当前界面下面来显示。

    63630

    vue里监听页面

    ;屏幕可用工作区宽度:window.screen.availWidth;scrollHeight: 获取对象高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容最左端之间距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容最顶端之间距离scrollWidth:获取对象宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定父坐标高度offsetLeft:获取对象相对于版面或由 offsetParent 属性指定父坐标计算左侧位置 相对容器水平坐标event.offsetY 相对容器垂直坐标document.documentElement.scrollTop 垂直方向值event.clientX+document.documentElement.scrollTop 相对文档水平座标+垂直方向量要获取当前页面条纵坐标位置,用:document.documentElement.scrollTop;而不是:document.body.scrollTop;

    1.9K40

    扫码关注云+社区

    领取腾讯云代金券