自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(9)
  • 收藏
  • 关注

原创 Flutter页面跳转Navigation和routes的基本使用

描述:1.Navigation实现页面跳转与传值2.routes路由实现页面跳转与传值内容:

2022-04-03 21:04:12 2930

原创 Flutter详解DraggableScrollableActuator

描述:调用DraggableScrollableActuator.reset(context)方法,通知子控件DraggableScrollableSheet位置到初始化状态效果图:代码:import 'package:flutter/material.dart';class DraggableScrollableActuatorPage extends StatefulWidget { const DraggableScrollableActuatorPage({Key.

2022-03-26 13:24:35 2703

原创 Flutter详解DraggableScrollableSheet可拖动和滑动的sheet

描述:使用DraggableScrollableSheet实现滑动效果效果图:​​​代码:import 'package:flutter/material.dart';class DraggableScrollableSheetPage extends StatefulWidget { const DraggableScrollableSheetPage({Key? key}) : super(key: key); @override State<Dr

2022-03-26 12:46:26 4253

原创 Flutter拖拽组件Draggable(2)

描述:使用Draggable 实现组件的拖动效果效果图:代码:class DraggablePositionPage extends StatefulWidget { const DraggablePositionPage({Key? key}) : super(key: key); @override State<DraggablePositionPage> createState() => _DraggablePositionPageStat.

2022-03-20 20:21:06 1376

原创 Flutter拖拽组件Draggable(1)

描述:使用Draggable 和 DragTarget结合,实现组件的拖动效果效果图:代码:class DraggblePage extends StatefulWidget { const DraggblePage({Key? key}) : super(key: key); @override State<DraggblePage> createState() => _DraggblePageState();}class _Draggbl

2022-03-20 18:36:02 2244

原创 Flutter ThemeData详解

factory ThemeData({ Brightness? brightness,// //调整亮度白天模式和夜间模式 VisualDensity? visualDensity,//视觉密度 MaterialColor? primarySwatch,//Material风格的组件提供主题色 Color? primaryColor,//应用程序主要部分(工具栏、标签栏等)的背景颜色 Brightness? primaryColorBrightness,//确定放..

2022-03-17 21:56:34 1627

原创 Flutter底部导航悬浮效果BottomNavigationBar:BottomAppBar

描述:通过底部导航BottomNavigationBar:BottomAppBar实现咸鱼悬浮效果效果图:代码:class TabNav extends StatefulWidget { const TabNav({Key? key}) : super(key: key); @override State<TabNav> createState() => _TabNavState();}class _TabNavState extend.

2022-03-16 20:34:41 1357

原创 Flutter底部导航BottomNavigationBar:BottomNavigationBar实现页面的切换效果

描述:通过底部导航BottomNavigationBar实现页面的切换效果效果图:方案1 :pageView和 _pageCtr.jumpToPage(index)结合,效果只初始当前页面的索引页,其他页面需要触发之后才会渲染方案2 :IndexedStack ,效果初始化所有页面代码:class TabNav extends StatefulWidget { const TabNav({Key? key}) : super(key: key); @ov

2022-03-13 15:17:19 2366 1

原创 常用布局之CSS3弹性盒子flex布局

一. 什么是弹性盒子布局CSS3 弹性盒( Flexible Box 或 flexbox),为了让元素适配不同的屏幕大小或者说页面的大小以及设备类型时确保元素拥有恰当的布局方式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。容器通过设置 display:flex 或 inline-flex将其定义为弹性容器,默认弹性容器只有一行。二.基本样式布局代码段<!DOCTYPE html><html> <he.

2021-09-25 21:45:44 1108

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除