Flutter硬件包演示插件hw_package_demo的使用
Flutter硬件包演示插件hw_package_demo的使用
本README描述了该包的功能。如果你将此包发布到pub.dev，此README的内容将会出现在你的包的主页上。
特性
TODO: 列出您的包可以做什么。也许可以包含图片、GIF或视频。
开始使用
TODO: 列出前提条件并提供或指向如何开始使用该包的信息。
使用
TODO: 包含供用户使用的简短且有用的示例。将更长的示例添加到/example文件夹。
const like = 'sample';
示例代码
example/main.dart
import 'package:flutter/material.dart';
import 'package:hw_package_demo/hw_package_demo.dart' as HWIndexbar;
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// 此部件是您的应用程序的根部件。
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const FriendsPage(),
);
}
}
class FriendsPage extends StatefulWidget {
const FriendsPage({Key? key}) : super(key: key);
[@override](/user/override)
_FriendsPageState createState() => _FriendsPageState();
}
class _FriendsPageState extends State<FriendsPage>
with AutomaticKeepAliveClientMixin {
final List<Friends> _headerData = [
Friends(imageAssets: 'images/新的朋友.png', name: '新的朋友'),
Friends(imageAssets: 'images/群聊.png', name: '群聊'),
Friends(imageAssets: 'images/标签.png', name: '标签'),
Friends(imageAssets: 'images/公众号.png', name: '公众号'),
];
Widget _cellForRow(BuildContext context, int index) {
if (index < _headerData.length) {
return _FriendsCell(
imageAssets: _headerData[index].imageAssets,
name: _headerData[index].name,
groupTitle: _headerData[index].indexLetter,
);
}
// 是否显示组名字！
bool _hiddenIndexLetter = (index - _headerData.length > 0 &&
_listDatas[index - _headerData.length].indexLetter ==
_listDatas[index - _headerData.length - 1].indexLetter);
return _FriendsCell(
imageUrl: _listDatas[index - _headerData.length].imageUrl,
name: _listDatas[index - _headerData.length].name,
groupTitle: _hiddenIndexLetter
? null
: _listDatas[index - _headerData.length].indexLetter,
);
}
final List<Friends> _listDatas = [];
List<Text> indexBar = [];
final double _cellHeight = 54.5;
final double _groupHeight = 30.0;
double _lastOffset = 0.0;
// 字典，里面放item和高度的对应的数据。
final Map _groupOffsetMap = {
INDEX_WORDS[0]: 0.0,
INDEX_WORDS[1]: 0.0,
};
late ScrollController _scrollController;
[@override](/user/override)
void initState() {
super.initState();
_scrollController = ScrollController();
// 创建数据
_listDatas
..addAll(datas)
..addAll(datas);
// 排序
_listDatas.sort((Friends a, Friends b) {
return a.indexLetter!.compareTo(b.indexLetter!);
});
var _groupOffset = _cellHeight * _headerData.length;
//
// 进过循环计算，将每一个头的位置算出来。放入字典
for (int i = 0; i < _listDatas.length; i++) {
if (i < 1) {
// 第一个cell一定有头！
_groupOffsetMap.addAll({_listDatas[i].indexLetter: _groupOffset});
// 保存完了再加_groupOffset
_groupOffset += _cellHeight + _groupHeight;
} else if (_listDatas[i].indexLetter == _listDatas[i - 1].indexLetter) {
// 不同存，只需要加Cell的高度
_groupOffset += _cellHeight;
} else {
_groupOffsetMap.addAll({_listDatas[i].indexLetter: _groupOffset});
// 保存完了再加_groupOffset
_groupOffset += _cellHeight + _groupHeight;
}
}
_lastOffset = _groupOffset;
}
[@override](/user/override)
Widget build(BuildContext context) {
super.build(context);
final List<Widget> words = [];
for (int i = 0; i < INDEX_WORDS.length; i++) {
words.add(Container(
alignment: Alignment.center,
padding: const EdgeInsets.all(5),
child: Text(
INDEX_WORDS[i],
style: const TextStyle(fontSize: 10, color: Colors.blue),
),
));
}
final GlobalKey _globalKey = GlobalKey();
return Scaffold(
appBar: AppBar(
backgroundColor: HWIndexbar.WechatThemColor,
actions: [
Container(
margin: const EdgeInsets.only(right: 15),
child: const Image(
image: AssetImage('images/icon_friends_add.png'),
color: Colors.black,
width: 25))
],
title: const Text(
"通讯录",
style: TextStyle(color: Colors.black),
),
),
body: Stack(
alignment: Alignment.centerRight,
children: [
Container(
color: HWIndexbar.WechatThemColor,
child: ListView.builder(
key: _globalKey,
controller: _scrollController,
itemBuilder: _cellForRow,
itemCount: _headerData.length + _listDatas.length,
),
), // 列表
HWIndexbar.IndexBar(
indexBarCallBack: (String str) {
// 拿到y值，globalToLocal当前位置我部件的原点(小部件左上角)的距离（x,y）
if (_groupOffsetMap[str] != null) {
double offset = _groupOffsetMap[str]!;
if ((_lastOffset - _groupOffsetMap[str]) <=
_globalKey.currentContext!.size!.height) {
offset =
_lastOffset - _globalKey.currentContext!.size!.height;
}
_scrollController.animateTo(offset,
duration: const Duration(microseconds: 100),
curve: Curves.easeIn);
}
},
) // 索引
],
));
}
[@override](/user/override)
// TODO: implement wantKeepAlive
bool get wantKeepAlive => true;
}
class _FriendsCell extends StatelessWidget {
final String? imageUrl;
final String? name;
final String? groupTitle;
final String? imageAssets;
const _FriendsCell(
{this.imageUrl, this.name, this.groupTitle, this.imageAssets});
[@override](/user/override)
Widget build(BuildContext context) {
return Container(
color: Colors.white,
child: Column(
children: [
Container(
padding: const EdgeInsets.only(left: 15),
height: groupTitle == null ? 0 : 30,
alignment: Alignment.centerLeft,
color: HWIndexbar.WechatThemColor,
child: groupTitle == null
? null
: Text(
groupTitle!,
style: const TextStyle(color: Colors.grey),
),
),
Row(
children: [
Container(
margin: const EdgeInsets.all(10),
height: 34,
width: 34,
decoration: BoxDecoration(
image: imageUrl == null
? DecorationImage(image: AssetImage(imageAssets!))
: DecorationImage(image: NetworkImage(imageUrl!)),
borderRadius: BorderRadius.circular(6))),
Expanded(
child: Column(
children: [
Container(
alignment: Alignment.centerLeft,
height: 54,
child: Text(
name!,
style: const TextStyle(fontSize: 18),
),
),
Container(
height: 0.5,
color: HWIndexbar.WechatThemColor,
), // 下划线
],
), // 昵称+下划线
),
],
)
],
),
);
}
}
const INDEX_WORDS = [
'🔍',
'☆',
'A',
'B',
'C',
'D',
'E',
'F',
'G',
'H',
'I',
'J',
'K',
'L',
'M',
'N',
'O',
'P',
'Q',
'R',
'S',
'T',
'U',
'V',
'W',
'X',
'Y',
'Z'
];
class Friends {
Friends({this.imageAssets, this.imageUrl, this.name, this.indexLetter});
final String? imageAssets;
final String? imageUrl;
final String? name;
final String? indexLetter;
}
List<Friends> datas = [
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/27.jpg',
name: 'Lina',
indexLetter: 'L'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/17.jpg',
name: '菲儿',
indexLetter: 'F'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/16.jpg',
name: '安莉',
indexLetter: 'A'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/31.jpg',
name: '阿贵',
indexLetter: 'A'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/22.jpg',
name: '贝拉',
indexLetter: 'B'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/37.jpg',
name: 'Lina',
indexLetter: 'L'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/18.jpg',
name: 'Nancy',
indexLetter: 'N'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/47.jpg',
name: '扣扣',
indexLetter: 'K'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/3.jpg',
name: 'Jack',
indexLetter: 'J'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/5.jpg',
name: 'Emma',
indexLetter: 'E'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/24.jpg',
name: 'Abby',
indexLetter: 'A'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/15.jpg',
name: 'Betty',
indexLetter: 'B'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/13.jpg',
name: 'Tony',
indexLetter: 'T'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/26.jpg',
name: 'Jerry',
indexLetter: 'J'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/men/36.jpg',
name: 'Colin',
indexLetter: 'C'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/12.jpg',
name: 'Haha',
indexLetter: 'H'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/11.jpg',
name: 'Ketty',
indexLetter: 'K'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/13.jpg',
name: 'Lina',
indexLetter: 'L'),
Friends(
imageUrl: 'https://randomuser.me/api/portraits/women/23.jpg',
name: 'Lina',
indexLetter: 'L'),
];
更多关于Flutter硬件包演示插件hw_package_demo的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复
更多关于Flutter硬件包演示插件hw_package_demo的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
hw_package_demo 是一个用于演示如何在 Flutter 中与硬件交互的插件。它通常用于展示如何通过 Flutter 插件与设备的硬件功能（如摄像头、传感器、蓝牙等）进行交互。以下是如何使用 hw_package_demo 插件的基本步骤：
1. 添加依赖项
首先，你需要在 pubspec.yaml 文件中添加 hw_package_demo 插件的依赖项。假设 hw_package_demo 插件已经发布到 pub.dev，你可以这样添加：
dependencies:
flutter:
sdk: flutter
hw_package_demo: ^1.0.0 # 使用最新版本
然后运行 flutter pub get 来获取依赖项。
2. 导入插件
在你的 Dart 文件中导入 hw_package_demo 插件：
import 'package:hw_package_demo/hw_package_demo.dart';
3. 使用插件
根据 hw_package_demo 插件的具体功能，你可以调用其提供的方法来与硬件交互。以下是一个简单的示例，假设插件提供了一些基本的硬件功能：
import 'package:flutter/material.dart';
import 'package:hw_package_demo/hw_package_demo.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: HardwareDemo(),
);
}
}
class HardwareDemo extends StatefulWidget {
[@override](/user/override)
_HardwareDemoState createState() => _HardwareDemoState();
}
class _HardwareDemoState extends State<HardwareDemo> {
String _hardwareInfo = 'Unknown';
[@override](/user/override)
void initState() {
super.initState();
_getHardwareInfo();
}
Future<void> _getHardwareInfo() async {
try {
String hardwareInfo = await HwPackageDemo.getHardwareInfo();
setState(() {
_hardwareInfo = hardwareInfo;
});
} catch (e) {
setState(() {
_hardwareInfo = 'Failed to get hardware info: $e';
});
}
}
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Hardware Demo'),
),
body: Center(
child: Text('Hardware Info: $_hardwareInfo'),
),
);
}
}