Manual way of text align instead of textAlign property in flutter

Question

I am working on flutter on Android studio (hedgehog). My aim is to write text on a specified position on top of a background image without using textalign property. I have tried using Alignment property and it works fine, but regardless of searching alot I didn't find resources to position text without text-align property.

Following is my code with text-align property:

import 'package:flutter/material.dart';

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

class RunMyApp extends StatelessWidget {
  const RunMyApp({super.key});

  @override
  Widget build(BuildContext context) {

    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(primarySwatch: Colors.green),
      home: Scaffold(
        // appBar: AppBar(
        //   title: Text("Text Over Image"),
        // ),
        body: Center(
          child: Stack(
            children: [
              Container(
                alignment: Alignment.center,
                child: Image.asset(
                  'assets/bckground6.png',
                  height: double.infinity,
                  width: double.infinity,
                  fit: BoxFit.cover,
                ),
              ),
              Container(
                  alignment: Alignment.topCenter,
                  child: Text(
                    'Text Over the Image',
                    style: TextStyle(color: Colors.white,
                        fontWeight: FontWeight.bold,
                        fontSize: 24.0),
                  )),
            ],
          ),
        ),
      ) ,
    );
  }
}

Following is my image of project tree and pubspec.yaml:

I have searched regarding alternative of textalign property but whatever I see is people are using textalign property instead of any manual method. I have also checked documentation but there I saw Align property.

Answer 1

you can use Transform.translate

        Stack(
          children: [
            Container(
              alignment: Alignment.center,
              child: Image.network(
                'https://picsum.photos/200/300?random=1',
                height: double.infinity,
                width: double.infinity,
                fit: BoxFit.cover,
              ),
            ),
            Transform.translate(
                offset: const Offset(55, 100),
                child: Text(
                  'Text Over the Image',
                  style: TextStyle(
                      color: Colors.white,
                      fontWeight: FontWeight.bold,
                      fontSize: 24.0),
                )),
          ],
        )