ঝাঁকুনি: উল্লম্বভাবে কেন্দ্রের কলাম

Question

কীভাবে উল্লম্বভাবে কোনও কলামকে কেন্দ্র করতে হবে? আমি "নতুন কেন্দ্র" উইজেট ব্যবহার করেছি। আমি "নতুন কেন্দ্র" উইজেট ব্যবহার করেছি, তবে এটি আমার কলামটি উল্লম্বভাবে কেন্দ্র করে না? কোন ধারনা সহায়ক হবে....

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text("Thank you"),
    ),
    body: new Center(
      child: new Column(
        children: <Widget>[
          new Padding(
            padding: new EdgeInsets.all(25.0),
            child: new AnimatedBuilder(
              animation: animationController,
              child: new Container(
                height: 175.0,
                width: 175.0,
                child: new Image.asset('assets/angry_face.png'),
              ),
              builder: (BuildContext context, Widget _widget) {
                return new Transform.rotate(
                  angle: animationController.value * 6.3,
                  child: _widget,
                );
              },
            ),
          ),
          new Text('We are glad we could serve you...', style: new TextStyle(
              fontSize: 16.0,
              fontWeight: FontWeight.w600,
              color: Colors.black87),),
          new Padding(padding: new EdgeInsets.symmetric(vertical: 5.0, horizontal: 0.0)),
          new Text('We appreciate your feedback ! !', style: new TextStyle(
              fontSize: 13.0,
              fontWeight: FontWeight.w200,
              color: Colors.black87),),
        ],
      ),
    ),
  );
}

Answer 1

আজিজের প্রস্তাবিত সমাধানটি হ'ল:

Column(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.center,
  children:children,
)

প্যাডিংয়ের কারণে এটি সঠিক কেন্দ্রে থাকবে না:

padding: new EdgeInsets.all(25.0),

কমপক্ষে এই ক্ষেত্রে - কেন্দ্রে কলামটি ঠিক মাঝখানে তৈরি করতে আপনার প্যাডিং অপসারণ করতে হবে।

Answer 2

চেষ্টা করুন:

Column(
 mainAxisAlignment: MainAxisAlignment.center,
 crossAxisAlignment: CrossAxisAlignment.center,
 children:children...)

Comments

এর আগেও চেষ্টা করেছি। এটি কেন্দ্র করে, কিন্তু এটি কেন এটি কেন্দ্র করে না?

— জিউসক্স

এটি একটি প্যাডিং ইস্যু ছিল। এখন এটি কাজ করে, ধন্যবাদ!

— জিউসক্স

Answer 3

কলাম সহ, ব্যবহার করুন:

mainAxisAlignment: MainAxisAlignment.center

এটি তার বাচ্চাদের (গুলি) এর মূল প্যারেন্ট স্পেসের মাঝখানে উল্লম্বভাবে সারিবদ্ধ করে

Answer 4

আপনি কীভাবে একটি সারিতে বা কলামটি মূল অ্যাক্সিসলাইনমেন্ট এবং ক্রসঅ্যাক্সিসলাইনমেন্ট বৈশিষ্ট্যগুলি ব্যবহার করে বাচ্চাদের সারিবদ্ধ করে control এক সারি জন্য, মূল অক্ষটি অনুভূমিকভাবে চলে এবং ক্রস অক্ষটি উল্লম্বভাবে চলে runs একটি কলামের জন্য, প্রধান অক্ষটি উল্লম্বভাবে চলে এবং ক্রস অক্ষটি অনুভূমিকভাবে চলে runs

 mainAxisAlignment: MainAxisAlignment.center,
 crossAxisAlignment: CrossAxisAlignment.center,

Answer 5

আর একবার চেষ্টা কর. এটি উল্লম্ব এবং অনুভূমিকভাবে কেন্দ্র করে।

Center(
  child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: children,
  ),
)

Answer 6

আর একটি সমাধান!

আপনি যদি কেন্দ্রের উল্লম্ব আকারে উইজেট সেট করতে চান তবে আপনি এর জন্য তালিকাভিউ ব্যবহার করতে পারেন। উদাহরণস্বরূপ: আমি তিনটি বোতাম ব্যবহার করেছি এবং সেগুলি তালিকাগুলির ভিতরে যুক্ত করব যা অনুসরণ করবে

সঙ্কুচিতভাবে মোড়ানো: সত্য -> এই তালিকাভুক্তির সাথে কেবল প্রয়োজনীয় স্থানটি দখল করে।

import 'package:flutter/material.dart';

class List extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final button1 =
        new RaisedButton(child: new Text("Button1"), onPressed: () {});
    final button2 =
        new RaisedButton(child: new Text("Button2"), onPressed: () {});
    final button3 =
        new RaisedButton(child: new Text("Button3"), onPressed: () {});
    final body = new Center(
      child: ListView(
        shrinkWrap: true,
        children: <Widget>[button1, button2, button3],
     ),
    );

    return new Scaffold(
        appBar: new AppBar(
          title: Text("Sample"),
        ),
        body: body);
  }
}    
void main() {
  runApp(new MaterialApp(
    home: List(),
  ));
}

আউটপুট:

Answer 7

আমার জন্য সমস্যাটি ছিল কলামটির ভিতরে প্রসারিত ছিল যা আমাকে সরিয়ে ফেলতে হয়েছিল এবং এটি কাজ করেছিল।

Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Expanded( // remove this
              flex: 2,
              child: Text("content here"),
            ),
          ],
        )

Answer 8

আপনি ব্যবহার করতে পারেন. mainAxisAlignment:MainAxisAlignment.center এটি কলাম অনুযায়ী কেন্দ্রের মাধ্যমে উপাদানটি তৈরি করবে। `ক্রসঅ্যাক্সিসলাইনমেন্ট: ক্রসএক্সিসএলাইনমেন্ট.সেন্টার 'এটি কেন্দ্রের আইটেমগুলি সারিবদ্ধভাবে সারিবদ্ধ করবে।

Container( alignment:Alignment.center, Child: Column () )

সহজভাবে ব্যবহার করুন। Center ( Child: Column () ) বা প্যাডিং উইজেট সহ র‌্যাপ। এবং প্যাডিংগুলি যেমন কলামের বাচ্চাদের মাঝে থাকে সেগুলি সামঞ্জস্য করুন।