Cum să SpaceEvenly și Redimensiona două elemente într-un Rând?

0

Problema

Am încercat să spaceevenly o Icon() și o AutoSizeText() într-un Row(). Atunci când valoarea este de mult cum puteți vedea în imaginile atașate se face după cum era de așteptat, dar atunci când valoarea este zero sau foarte scurt, AutoSizeText() este centrat, dar cauzele care au aceeași distanță față de margini nu mai este menținută. Există o distanță suplimentară cauzată de centrare. Nu știu cum de a repara acest lucru.

Edit. Dacă nu era clar, mă refer la roz pictogramă geantă de cumpărături și suma arătat în "Riepilogo Settimanale" secțiune. Dacă te uiți la Restaurant Icon și valoarea sa, se poate observa cum ei nu sunt centrate, ele sunt mai aproape de marginea din stânga.

orginal view

enter image description here

Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20),
      ),
      width: size.width * 0.3,
      height: size.height,
      // height: size.height * 0.055,
      child: Row(
        children: [
          Spacer(),
          Expanded(
            flex: 3,
            child: Container(
              child: LayoutBuilder(
                builder: (context, constraint) {
                  return Icon(
                    icona,
                    color: colore,
                    size: constraint.biggest.width * 1,
                  );
                },
              ),
            ),
          ),
          Spacer(),
          Expanded(
            flex: 6,
            child: Center(
              child: AutoSizeText(
                importo,
                style: TextStyle(
                  fontSize: 20,
                  fontWeight: FontWeight.bold,
                  color: colore,
                ),
                maxLines: 1,
              ),
            ),
          ),
          Spacer(),
        ],
      ),
    )
android dart flutter flutter-layout
2021-11-23 20:16:17
1

Cel mai bun răspuns

1

Dacă am înțeles bine, vrei să-dreapta aliniază textul, nu în centrul ei.

Pentru a realiza acest lucru, luați în considerare utilizarea o singură Spacer() în-între pictograma și textul. Exterior spațiere (marjă și padding) se poate face folosind Padding widget-ul în loc.

2021-11-24 00:29:45

La început, am vrut să aibă un comportament similar cu spațiul uniform propery de Rând, am vrut același spațiu între marginea din stânga-pictograma, pictograma-text, text-marginea din dreapta. Nu știu cum de a realiza că, deși, pentru că textul a modifica dimensiunea de indata ce-l redimensiona, astfel încât distanțier ar trebui să fie capabil de a redimensiona în consecință. Am decis că era mai bine să doar dreptul de a alinia textul cum ai sugerat, chiar dacă acest lucru nu este ceea ce am vrut, dar se pare decent
iocomxda

@iocomxda, oh, dacă ai vrut să aibă același spațiu în 3 goluri, puteți încerca pentru a pune 3 Spacer() widget-uri pentru asta. Dar textele (având diferite lățime) nu se va alinia cu fiecare alte pe pagina (ca având $2666 și $0), astfel încât, de-align este cea mai comună abordare.
user1032613

Mulțumesc pentru explicație! Nu știu-align a fost cea mai comună abordare.
iocomxda

În alte limbi

Această pagină este în alte limbi

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................