我该怎么办,无论文本多长时间都具有相同的开始对齐方式?

发布于 2025-02-12 22:20:06 字数 2137 浏览 0 评论 0原文

我做一个无状态的小部件category_card,将使用四次。

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';

class CategoryCard extends StatelessWidget {
  final String svgSrc;
  final String title;
  final VoidCallback press;
  const CategoryCard(
      {Key? key,
      required this.svgSrc,
      required this.title,
      required this.press})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(13),
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(13),
            boxShadow: [
              BoxShadow(
                color: Colors.grey.withOpacity(0.15),
                spreadRadius: 5,
                blurRadius: 7,
                offset: const Offset(0, 3), // changes position of shadow
              ),
            ],
          ),
          child: Material(
            color: Colors.transparent,
            child: InkWell(
              onTap: press,
              child: Padding(
                padding: const EdgeInsets.all(20.0),
                child: Column(
                  children: [
                    const Spacer(),
                    SvgPicture.asset(
                      svgSrc,
                      height: 100,
                      width: 100,
                    ),
                    const Spacer(),
                    Text(
                      title,
                      style: Theme.of(context).textTheme.subtitle1!.copyWith(
                          fontWeight: FontWeight.w800,
                          fontSize: 15,
                          color: Colors.blueGrey[900]),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

我的输出还不错,但是长文本(例如医学状况)的文本部分该单词与较短的单词(例如过敏)不符。我该怎么办,无论文本多长时间都具有相同的开始对齐方式? 在此处输入图像描述

I do a stateless widget category_card which is going to use four times.

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';

class CategoryCard extends StatelessWidget {
  final String svgSrc;
  final String title;
  final VoidCallback press;
  const CategoryCard(
      {Key? key,
      required this.svgSrc,
      required this.title,
      required this.press})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(13),
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(13),
            boxShadow: [
              BoxShadow(
                color: Colors.grey.withOpacity(0.15),
                spreadRadius: 5,
                blurRadius: 7,
                offset: const Offset(0, 3), // changes position of shadow
              ),
            ],
          ),
          child: Material(
            color: Colors.transparent,
            child: InkWell(
              onTap: press,
              child: Padding(
                padding: const EdgeInsets.all(20.0),
                child: Column(
                  children: [
                    const Spacer(),
                    SvgPicture.asset(
                      svgSrc,
                      height: 100,
                      width: 100,
                    ),
                    const Spacer(),
                    Text(
                      title,
                      style: Theme.of(context).textTheme.subtitle1!.copyWith(
                          fontWeight: FontWeight.w800,
                          fontSize: 15,
                          color: Colors.blueGrey[900]),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

My output is alright, but the text part for long text such as medical condition the word is not align with the shorter word such as allergy. What can I do so that no matter how long the text all will have same starting alignment?
enter image description here

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

半衾梦 2025-02-19 22:20:06

您可以使用属性在同一点制作所有项目

Column(
crossAxisAlignment: CrossAxisAlignment.start, // or you can change it depends your need  
children: [

you can use Column property for making all it's item at the same point

Column(
crossAxisAlignment: CrossAxisAlignment.start, // or you can change it depends your need  
children: [
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文