FlutterDevicePlugin/example/lib/device.dart

import 'package:flutter/material.dart';
import 'package:vnote_device_plugin/models/device.dart';

class DeviceCard extends StatefulWidget {
  final DeviceInfo? data;

  const DeviceCard({super.key, required this.data});

  @override
  State<StatefulWidget> createState() => _DeviceCardState();
}

class _DeviceCardState extends State<DeviceCard> {
  @override
  Widget build(BuildContext context) {
    final data = widget.data;
    return Card(
      elevation: 4,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
      child: Container(
        width: 360,
        height: 160,
        padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _InfoItem(label: "产品名称", content: data?.productName),
            _InfoItem(label: "产品型号", content: data?.model),
            _InfoItem(label: "蓝牙名称", content: data?.bleName),
            _InfoItem(label: "蓝牙地址", content: data?.mac),
          ],
        ),
      ),
    );
  }
}

class _InfoItem extends StatelessWidget {
  final String label;
  final String? content;

  const _InfoItem({super.key, required this.label, this.content});

  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.centerLeft,
      height: 32,
      child: Row(
        children: [
          Text(
            "$label:",
            style: const TextStyle(fontSize: 18, color: Colors.black54),
          ),
          const SizedBox(width: 16),
          Text(
            content ?? "",
            style: const TextStyle(fontSize: 18),
          ),
        ],
      ),
    );
  }
}