model_viewer: ^0.8.1 #3D渲染glTF和GLB模型
import 'package:flutter/material.dart';
import 'package:model_viewer/model_viewer.dart';
class ModelViewerPage extends StatefulWidget {
const ModelViewerPage({Key key}) : super(key: key);
@override
_ModelViewerPageState createState() => _ModelViewerPageState();
}
class _ModelViewerPageState extends State<ModelViewerPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Model Viewer"),
),
body: ModelViewer(
backgroundColor: Color.fromARGB(0xFF, 0xEE, 0xEE, 0xEE),
// src: 'https://modelviewer.dev/shared-assets/models/Astronaut.glb', //网页资源路径
src: 'resource/glb/Astronaut.glb', //本地资源路径
alt: "A 3D model of an astronaut",
ar: true,
autoRotate: true,
cameraControls: true,
),
);
}
}
/*
**src:**此参数用于3D模型的URL或路径。此参数是必需的。仅支持glTF / GLB型号。
**alt:**此参数用于设计具有自定义内容的模型,该内容将利用使用屏幕阅读器或在任何情况下都依赖于额外的语义设置来理解他们所看到内容的观察者来描绘模型。
**autoRotateDelay:**此参数用于设置在自动旋转开始之前的延迟。价值的配置是以毫秒为单位的数字。默认值为3000。
**iosSrc:**此参数用于USDZ模型的URL,该模型将通过AR Quick Look在受支持的iOS 12+设备上使用。
**arScale:**此参数用于控制Scene Viewer在AR模式下的缩放行为。设置为“固定”以使模型的缩放比例失效,从而将其始终设置为100%缩放比例。默认为“自动”,这允许调整模型的大小。
* */
/*
alt : 我们将添加alt mean,以使用自定义文本配置模型,该文本将向使用屏幕阅读器的观看者描述该模型;
autoPlay : 自动播放是指如果设置为true并且模型具有动画,则设置此属性后,动画将自动开始播放。默认为false。
autoRotate : 我们将添加autoRotate意味着它启用了模型的自动旋转。
cameraControls : 我们将添加cameraControls表示在平面视图中通过鼠标/触摸启用控件。当我们运行应用程序时,我们应该获得屏幕的输出,如屏幕下方的截图所示。
* */
参考:
https://www.cnblogs.com/MakeView660/p/12809917.html#/
https://www.jianshu.com/p/7495db1d18e7
https://cloud.tencent.com/developer/article/1816577
https://blog.csdn.net/m0_37667770/article/details/81042916
网友评论