How can I justify text with Flutter markdown?

Question

I started using flutter markdown, however I'd like to justify the content, and I couldn't until now.

I tried using a Center and Alignment but didn't work.

import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';

class OutsideBankHourDescription extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    String text =
        "Antecipações em __horários__ bancários acontecem em 1h na média. __Fora do horário bancário__ o saldo estará em sua conta __no dia seguinte.__";

    return Expanded(
      child: Container(
        alignment: Alignment.center,
        child: Markdown(
          styleSheet: MarkdownStyleSheet.fromTheme(Theme.of(context)),
          data: text,
        ),
      ),
    );
  }
}

Coming

Answer 1

It's not available for now to change text alignment in flutter_markdown 0.2.0. You must contact the authors of this plugin to request this feature.

But if you need fast fix, you can add textAlign: TextAlign.center attribute in source code of this file: https://github.com/flutter/flutter_markdown/blob/master/lib/src/builder.dart

Line of code: 345

mergedTexts.add(new RichText(text: mergedSpan, textAlign: TextAlign.center));

Result:

For more elegant way you must clone git repository of this plugin, attach to your project directly and work to add text alignment feature on your own.

Randazzo

code github crashed – Wein

Answer 2

It becomes possible to set up proper text alignment with flutter_markdown.

    var style = MarkdownStyleSheet(
        textAlign: WrapAlignment.center,
        h1Align: WrapAlignment.center,
      );
    Markdown(
        styleSheet: style,
        data: '# header1 is center-aligned\ntext body is also center-aligned'
    );

You can customized your styles with all the other optional parameters provided by MarkdownStyleSheet class.

Nautical

The alignment doesn't seem to work for strings that have formats, though, like bolds or hyperlinks... at least for me anyway, in v0.3.4. – Roundsman

The alignment styles shall work regardless of the formats such as bolds or hyperlinks. Can you paste a code snippet so other people can also look into it and maybe figure out a solution? – Nautical

Not sure why myself. I did exactly like you did except with MarkdownBody. The string is something like this (bold text at the end): "Lorem ipsum dolor quis elit duis ullamco aute ut. Magna ullamco duis tempor nulla." – Roundsman

Oh, I think it happened if the text is too long that it wrapped the text to multiple lines. If I used shorter text that fits in one line, it works. – Roundsman

Answer 3

This worked for me using MarkdownBody.

MarkdownBody(
  data: data,
  fitContent: false,
  styleSheet: MarkdownStyleSheet(
    textAlign: WrapAlignment.center,
  ),
)

fitContent is misleading, but setting it to false stretches the text to fit the parent. If you're using MarkdownBody in a stretched-width column, this seems to do the trick.

Kabul