how to create 2 text in 1 Raw

Whenever you make an app in Flutter, you will need horizontal text at some point. Today in this post, we will learn how to write multiple text horizontally. There are 2 popular methods for writing horizontal text - Row, Richtext.

Whatever is a row in Flutter, we can use rows to place any text, image, or any type of component like button, image, container, icon etc. horizontally through rows.

Row

  
   
   
   Row(
  mainAxisAlignment: MainAxisAlignment.center, 
  children: [
    Text("Fast, ", style: TextStyle(fontSize: 18)),
    Text("Affordable!", style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),

Text("Truested!", style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),

  ],
)

  
  
  

Rich Text

RichText is a widget in Flutter that allows you to display text with multiple styles. Instead of using just one TextStyle for the entire text, RichText lets you apply different styles to different parts of your text using TextSpan.

Flutter offers a wide range of powerful widgets, and one such widget is the RichText widget. If you ever wanted to style different parts of a single text differently (like bold, italic, or changing colors), RichText is the go-to widget.

  
   
   RichText(
  text: TextSpan(
    style: TextStyle(fontSize: 18, color: Colors.black),
    children: [
      TextSpan(text: "Hello, "),
      TextSpan(text: "World!", style: TextStyle(fontWeight: FontWeight.bold, color: Colors.blue)),
    ],
  ),
)


 
  
  

Code Explanation:

• Row: A layout widget that places its children horizontally.

• Text: Two separate Text widgets used to display and style parts of the text individually.

• You can apply individual styles to each Text widget.

• Useful when you want to keep widgets separate and maybe include other widgets (like icons) between them.

• RichText: A widget for displaying text with multiple styles in a single block.

• TextSpan: Used to apply different styles to parts of the same text.

• Allows fine-grained styling without breaking the text layout.

Output: