将行文本右对齐

我正在尝试将“立即预订”文本和“添加到购物车”图标对齐到屏幕的右侧。我尝试添加文本对齐方式属性,也尝试使用扩展/列。它没有与屏幕的右侧对齐。有任何解决方法吗?谢谢

Sample code and screenshot below tried in - https://www.dartpad.dev/flutter

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Row(
      children: <Widget>[
        InkWell(
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Icon(Icons.add_shopping_cart),
              Text('Book Now', textAlign: TextAlign.right),
            ],
          ),
        )
      ],
    );
  }
}

sample screenshot

评论
iodit
iodit

尝试这个:

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: MyWidget(),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Align(
      alignment:  Alignment.centerRight,
      child: InkWell(
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Icon(Icons.add_shopping_cart),
            Text('Book Now', textAlign: TextAlign.right),
          ],
        ),
      ),
    );
  }
} 

enter image description here

点赞
评论
avelit
avelit

您要它对准右边吗?

Use mainAxisAlignment: MainAxisAlignment.end on your first row.

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.end,
      children: <Widget>[
        InkWell(
          child: Row(
            children: <Widget>[
              Icon(Icons.add_shopping_cart),
              Text('Book Now', textAlign: TextAlign.right),
            ],
          ),
        )
      ],
    );
  }
}

Right-Aligned

点赞
评论