首页 > 其他分享 >【Flutter&Dart】tolyui_feedback组件例子效果(23 /100)

【Flutter&Dart】tolyui_feedback组件例子效果(23 /100)

时间:2025-01-12 16:57:17浏览次数:3  
标签:feedback 23 Text message 弹框 child TolyTooltip tolyui 100

上效果图

在这里插入图片描述
有12种位置展示效果;很能满足大部分需要

代码如下:

import 'package:flutter/material.dart';
import 'package:tolyui_feedback/tolyui_feedback.dart';

class TolyTooltipDemo extends StatelessWidget {
  const TolyTooltipDemo({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('TolyTooltipDemo'),
        ),
        body: Center(
          child: Column(
            spacing: 10.0,
            children: [
              TolyTooltip(
                message: '默认位置展示',
                child: Text('默认'),
              ),
              TolyTooltip(
                placement: TooltipPlacement.left,
                message: '左侧展示',
                child: Text('设置左侧提示'),
              ),
              TolyTooltip(
                placement: TooltipPlacement.right,
                message: '右侧展示',
                child: Text('设置右侧提示'),
              ),
              TolyTooltip(
                placement: TooltipPlacement.bottom,
                message: '底部展示',
                child: Text('设置底部提示'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

TolyUI介绍:

  • 动画展示/隐藏浮层弹框。
  • 支持 12 种弹框与目标组件的对齐方式。
  • 支持气泡框和非气泡框,填充与边模式线的弹框。
  • 支持边界溢出检测,并自动适应偏移功能。

使用方式非常简单,直接通过 TolyTooltip 组件嵌套在目标组件之上即可。其中:

textStyle 参数可以指定浮窗内文字样式。
padding 参数设置浮层弹框内边距。
placement 参数设置浮层弹框和目标组件的对其方式。
gap 参数设置浮层弹框和目标组件的距离。
message 参数设置浮层弹框文字内容

配置如下:

# 仅使用反馈模块 
dependencies: 
   tolyui_feedback: ^0.2.0
# 或者使用
# 使用 tolyui 全家桶 
dependencies: 
    tolyui: ^0.2.0

选了TolyTooltip来介绍一下,tolyui有个全家桶可以使用的;嗯!
具体详情参考地址:Flutter TolyUI 框架#02 | Popover 与 Tooltip 设计
应该是很强大,但目前我这需要的不多蛤!感兴趣的大佬试试!!!

==============================END

标签:feedback,23,Text,message,弹框,child,TolyTooltip,tolyui,100
From: https://blog.csdn.net/lichong951/article/details/145030065

相关文章

  • B3841 [GESP202306 二级] 自幂数判断
    题目描述自幂数是指,一个N 位数,满足各位数字N 次方之和是本身。例如,153 是 3 位数,其每位数的 3 次方之和,1**3+5**3+3**3=153,因此 153 是自幂数;1634 是 4 位数,其每位数的 4 次方之和,1**4+6**4+3**4+4**4=1634,因此 1634是自幂数。现在,输入若干个正整数,请判断它们......
  • LeetCode热题100中 35. 46. 70. 73. 118.
    35.搜索插入位置题目描述:实现思路:        这里主要就是二分查找,二分查找要注意对边界值的处理,l是数组的第一位,r是数组的最后一位,l<=r我们就返回l,因为我们的判断是nums[mid]<target 取的是mid的左区间已经不包含mid了,所以是 l=mid+1。代码:var......
  • (即插即用模块-Attention部分) 四十一、(2023) MLCA 混合局部通道注意力
    文章目录1、MixedLocalChannelAttention2、代码实现paper:MixedlocalchannelattentionforobjectdetectionCode:https://github.com/wandahangFY/MLCA1、MixedLocalChannelAttention现有通道注意力机制的局限性:大多数通道注意力机制只关注通道特征信......
  • 【练习】力扣 热题100 最大子数组和
    题目给你一个整数数组nums,请你找出一个具有最大和的连续子数组(子数组最少包含一个元素),返回其最大和。子数组是数组中的一个连续部分。示例1:输入:nums=[-2,1,-3,4,-1,2,1,-5,4]输出:6解释:连续子数组[4,-1,2,1]的和最大,为6。示例2:输入:nums=[1]输出:......
  • 全国省市县温室气体排放量数据(1970-2023)
    数据简介该数据为每个部门和国家的三种主要温室气体(CO2、CH4、N2O)和氟化气体的排放量估计值。CO2化石和生物成分的排放量是分开提供的。化石CO的排放2(也称为CO2_excl_short-cycle_org_C)包括所有化石CO2来源,例如化石燃料燃烧、非金属矿物工艺(例如水泥生产)、金属(黑色......
  • 100_基于springboot的图书管理系统
    ......
  • Life Long Learning(李宏毅)机器学习 2023 Spring HW14 (Boss Baseline)
    1.终身学习简介神经网络的典型应用场景是,我们有一个固定的数据集,在其上训练并获得模型参数,然后将模型应用于特定任务而无需进一步更改模型参数。然而,在许多实际工程应用中,常见的情况是系统可以不断地获取新数据,例如Web应用程序中的新用户数据或自动驾驶中的新驾驶数据。......
  • 23. 对话框控件
    一、对话框应用  对话框窗口是一个用来完成简单任务或者和用户进行临时交互的顶层窗口,通常用于输入信息、确认信息或者提示信息。QDialog类是所有对话框窗口类的基类。  按照运行时是否可以和其他窗口进行交互操作,对话框分为模式(或模态)对话框和非模式对话框。对于带有模式......
  • LeetCode热题100(二十六) —— 142.环形链表II
    LeetCode热题100(二十六)——142.环形链表II题目描述代码实现思路解析你好,我是杨十一,一名热爱健身的程序员在Coding的征程中,不断探索与成长LeetCode热题100——刷题记录(不定期更新)此系列文章用于记录我在学习LeetCode热题100过程中的总结和收获愿与诸君共同探讨,在......
  • cpu占用率为什么有时会超过100%?
    文章目录cpu占用率为什么有时会超过100%?1.多核处理器的影响2.监控工具的计算方式3.虚拟化环境的影响4.短时间峰值5.软件或驱动程序的问题结论cpu占用率为什么有时会超过100%?CPU占用率超过100%的现象在多核处理器系统中是比较常见的,主要原因如下:1.多核处......