如何在顫動中調整 ListTile 復選框和標題的位置

Question

我正在使用flutter（ v3.0.4 ）編寫一個簡單的GTD應用程序，現在我面臨一個問題是我不知道如何調整ListTile復選框和標題的位置，這是main.dart的最小重現示例代碼：

import 'dart:collection';

import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:get/get_state_manager/src/simple/get_state.dart';

import 'main_controller.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  Map<int, String> getCategories() {
    Map<int, String> categories = HashMap<int, String>();
    categories.putIfAbsent(1, () => "已過期");
    return categories;
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MainController>(
        init: MainController(),
        builder: (controller) {
          return Scaffold(
            //appBar: AppBar(title: Text("title")),
            body: SingleChildScrollView(
              child: ListView.builder(
                  scrollDirection: Axis.vertical,
                  shrinkWrap: true,
                  itemBuilder: (BuildContext context, int index) => Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 6.0),
                        child: Card(
                          child: ExpansionTile(
                            title: Text(getCategories()[index + 1]!),
                            children: [
                              Slidable(
                                actionPane: SlidableDrawerActionPane(),
                                actionExtentRatio: 0.25,
                                actions: <Widget>[
                                  IconSlideAction(
                                    caption: '刪除',
                                    color: Colors.blue,
                                    icon: Icons.archive,
                                    onTap: () async => {},
                                  ),
                                ],
                                child: ListTile(
                                  trailing: Text(
                                    "scheduleTime",
                                    style: new TextStyle(color: Colors.blue),
                                  ),
                                  leading: Theme(
                                      data: ThemeData(
                                        primarySwatch: Colors.blue,
                                      ),
                                      child: Checkbox(
                                        value: false,
                                        onChanged: (bool? value) {},
                                      )),
                                  title: Text("element.name", overflow: TextOverflow.ellipsis),
                                  selected: false,
                                  onTap: () {},
                                ),
                              )
                            ],
                          ),
                        ),
                      ),
                  itemCount: getCategories().length),
            ),
          );
        });
  }
}

這是main_controller.dart ：

import 'package:get/get.dart';
import 'package:get/get_state_manager/src/simple/get_controllers.dart';

class MainController extends GetxController {}

這是依賴項：

name: untitled
description: A new Flutter project.

publish_to: 'none' 

version: 1.0.0+1

environment:
  sdk: ">=2.16.1 <3.0.0"

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^1.0.2
  get: ^4.3.8
  flutter_slidable: 0.6.0

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: ^1.0.0

flutter:
  uses-material-design: true

我應該怎么做才能使復選框和標題更接近？ 將復選框向左移動一點。 這是現在的結果：

復選框和標題應該更接近。

Answer 1

ListTile 有一個名為 Horizo​​ntalTitleGap 的屬性，可以控制間距。