假设我们有几个背景图片:
我们如何使用函数选择图像的左上,右上,左下,右下和中心中心像素颜色并将其保存在vars中?
我没找到什么好去的..
编辑,这是我到目前为止获得的代码。
import 'dart:async';
import 'dart:typed_data';
import 'dart:ui' as ui;
import 'package:image/image.dart' as img;
import 'package:flutter/services.dart' show rootBundle;
import 'package:flutter/rendering.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:muego_dev2/models/songs.dart';
import 'package:provider/provider.dart';
class ColorDetect extends StatefulWidget {
//static const routeName = '/';
@override
_ColorDetectState createState() => _ColorDetectState();
}
class _ColorDetectState extends State<ColorDetect> {
@override
Widget build(BuildContext context) {
final coverData = 'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl.jpg';
img.Image photo;
void setImageBytes(imageBytes) {
List<int> values = imageBytes.buffer.asUint8List();
photo = null;
photo = img.decodeImage(values);
}
// image lib uses uses KML color format, convert #AABBGGRR to regular #AARRGGBB
int abgrToArgb(int argbColor) {
int r = (argbColor >> 16) & 0xFF;
int b = argbColor & 0xFF;
return (argbColor & 0xFF00FF00) | (b << 16) | r;
}
// FUNCTION
Future<void> _getColor() async {
Uint8List data = (await NetworkAssetBundle(Uri.parse(coverData))
.load(coverData)
)
.buffer
.asUint8List();
setImageBytes(data);
//FractionalOffset(1.0, 0.0); //represents the top right of the [Size].
double px = 1.0;
double py = 0.0;
int pixel32 = photo.getPixelSafe(px.toInt(), py.toInt());
int hex = abgrToArgb(pixel32);
print("Value of int: $hex ");
}
return Scaffold(
appBar: AppBar(
),
body: Column(
children: <Widget>[
Flexible(
flex: 2,
child: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(coverData),
fit: BoxFit.cover,
),
),
),
),
Flexible(
flex: 1,
child: Container(
color: HOW TO APPLY MY HEX COLOR HERE?????,
),
),
Spacer(),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
MaterialButton(
elevation: 5.0,
padding: EdgeInsets.all(15.0),
color: Colors.grey,
child: Text("Get Sizes"),
onPressed: null,
),
MaterialButton(
elevation: 5.0,
color: Colors.grey,
padding: EdgeInsets.all(15.0),
child: Text("Get Positions"),
onPressed: _getColor,
)
],
),
)
],
),
);
}}
这就是我用值
$hex
打印的内容Restarted application in 1.419ms.
I/flutter ( 2103): Value of int: 4287593304
我不确定现在是否已经有十六进制值。那么如何将其应用于我的容器颜色?似乎还缺少一些东西。
最佳答案
您好您尝试使用此功能吗?
https://api.flutter.dev/flutter/image/Image/getPixel.html
int getPixel (
int x,
int y
)
从给定的x,y坐标获取像素。颜色在Uint32中编码为#AABBGGRR。不进行范围检查。
工作示例:
import 'dart:typed_data';
import 'package:image/image.dart' as img;
import 'package:flutter/rendering.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
//import 'package:muego_dev2/models/songs.dart';
//import 'package:provider/provider.dart';
main() {
runApp(MaterialApp(home: ColorDetect()));
}
class ColorDetect extends StatefulWidget {
//static const routeName = '/';
@override
_ColorDetectState createState() => _ColorDetectState();
}
class _ColorDetectState extends State<ColorDetect> {
final coverData =
'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl.jpg';
img.Image photo;
void setImageBytes(imageBytes) {
print("setImageBytes");
List<int> values = imageBytes.buffer.asUint8List();
photo = null;
photo = img.decodeImage(values);
}
// image lib uses uses KML color format, convert #AABBGGRR to regular #AARRGGBB
int abgrToArgb(int argbColor) {
print("abgrToArgb");
int r = (argbColor >> 16) & 0xFF;
int b = argbColor & 0xFF;
return (argbColor & 0xFF00FF00) | (b << 16) | r;
}
// FUNCTION
Future<Color> _getColor() async {
print("_getColor");
Uint8List data;
try{
data =
(await NetworkAssetBundle(
Uri.parse(coverData)).load(coverData))
.buffer
.asUint8List();
}
catch(ex){
print(ex.toString());
}
print("setImageBytes....");
setImageBytes(data);
//FractionalOffset(1.0, 0.0); //represents the top right of the [Size].
double px = 1.0;
double py = 0.0;
int pixel32 = photo.getPixelSafe(px.toInt(), py.toInt());
int hex = abgrToArgb(pixel32);
print("Value of int: $hex ");
return Color(hex);
}
@override
Widget build(BuildContext context) {
print("build");
return Scaffold(
appBar: AppBar(),
body: Column(
children: <Widget>[
Flexible(
flex: 2,
child: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(coverData),
fit: BoxFit.cover,
),
),
),
),
Flexible(
flex: 1,
child:
FutureBuilder(
future: _getColor(),
builder: (_, AsyncSnapshot<Color> data){
if (data.connectionState==ConnectionState.done){
return Container(
color: data.data,
);
}
return CircularProgressIndicator();
}
),
),
Spacer(),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
MaterialButton(
elevation: 5.0,
padding: EdgeInsets.all(15.0),
color: Colors.grey,
child: Text("Get Sizes"),
onPressed: null,
),
MaterialButton(
elevation: 5.0,
color: Colors.grey,
padding: EdgeInsets.all(15.0),
child: Text("Get Positions"),
onPressed: _getColor,
)
],
),
)
],
),
);
}
}
关于flutter - Flutter从var中的图像获取像素颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61793700/