Resposive Alignment of 2 items in flutter

28 views Asked by At

I'm trying to resposively align 2 items which are an animated text and a robot image, in the image robot has a display screen and the text should always be aligned in the robot's screen, looking forward for some tips, thanks in advance.

     @override
  Widget build(BuildContext context) {
    return Container(
      decoration: mainTheme(),
      child: Scaffold(
        body: Container(
          padding: const EdgeInsets.symmetric(horizontal: 40, vertical: 0),
          // Robot Image
          decoration: const BoxDecoration(
            image: DecorationImage(
              image: AssetImage('lib/assets/My project-1.png'),
              fit: BoxFit.cover,
              alignment: Alignment.bottomLeft,
              opacity: 0.6,
            ),
          ),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              SizedBox(
               //
              ),
              Column(
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  const Text(
                    //Page Title    
                  ),
                    child: TextFormField( //
                  ),
                  Row(
                    children: [
                      Padding(
                        //Funny Animated Text
                        padding: EdgeInsets.only(
                          left: MediaQuery.of(context).size.width * .67,
                        ),
                        child: ClipRRect(
                          child: Align(
                            widthFactor: 0.14,
                            child: AnimatedBuilder(
                              animation: _animation,
                              builder: (context, child) {
                                return Transform.translate(
                                  offset: Offset(
                                      MediaQuery.of(context).size.width *
                                          _animation.value,
                                      0.9),
                                  child: child,
                                );
                              },
                              child: Text()

I tried many diffrent alignments but everytime when ı changed the aspect ratio, whole thing broke apart.

0

There are 0 answers