Skip to content

Instantly share code, notes, and snippets.

@richard457
Created September 16, 2020 07:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save richard457/9ec3c57d69c893cfbffd5412b3ecb0fe to your computer and use it in GitHub Desktop.
Save richard457/9ec3c57d69c893cfbffd5412b3ecb0fe to your computer and use it in GitHub Desktop.
Text does not start on the same line.
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class User{
List<String> numbers;
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
User user = User();
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Column(children:[
Text('hello world...kfjfjfjfjfjfjfjfjfjfjfjfjfjfjfjfjf'),
Text('hello world..'),
]),
),
);
}
}
@richard457
Copy link
Author

Have you encountered the issue where you want to display text lile

  • long text...........................................
  • short text.
    you can see that I want the text to start at same position and you can think wrapping Text('') into Column
    but does not work!, i.e does not start at same position.

@richard457
Copy link
Author

richard457 commented Sep 16, 2020


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

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

class User {
  List<String> numbers;
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  User user = User();

  List<TextSpan> textSpans = [
    TextSpan(text: 'Woolha \n', style: TextStyle(color: Colors.blue)),
    TextSpan(
        text:
            'dot hello sir world long line with more context should start new line sir \n'),
    TextSpan(text: 'com \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: RichText(
          text: TextSpan(
            style: TextStyle(color: Colors.black, fontSize: 18),
            children: <TextSpan>[...textSpans],
          ),
        ),
      ),
    );
  }
}

@richard457
Copy link
Author


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

void main() {
  runApp(MyApp());
}
class User{
  List<String> numbers;
}
class MyApp extends StatefulWidget {

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  User user = User();
  	
  List<TextSpan> textSpans = <TextSpan>[
    TextSpan(text: 'Woolha \n', style: TextStyle(color: Colors.blue)),
    TextSpan(text: 'dot hello world long line with more context should start new line sir \n'),
    TextSpan(text: 'com \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
    TextSpan(text: 'word \n'),
  ];
  
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: RichText(
    text: TextSpan(
        style: TextStyle(color: Colors.black, fontSize: 18),
        children: textSpans,
    ),
  ),
      ),
    );
  }
}

This is how I solved it.

@richard457
Copy link
Author

richard457 commented Sep 16, 2020

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment