Everything expands to screenwidth inside a Listview. Can I change that?

Question

I\'m trying to make a design of a chat screen for an app that I\'m making. To make it scrollable I placed all the chat messages inside a listview. But everything I place inside

Answer 1

You can use Align widget to align it's child inside it's parent.

Simply wrap your list nodes (Card instances) inside a Align.

 import 'package:flutter/material.dart';
//import '../../Library/Library.dart';
//import '../../Ui/ChatMessage.dart';

void main() {
  runApp(
    new MaterialApp(
      home: new ChatScreen(),
    ),
  );
}

class ChatScreen extends StatefulWidget {
  @override
  State createState() {
    return new ChatScreenState();
  }
}

class ChatScreenState extends State {
  bool overlayShouldBeVisible = false;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(body: new ListView.builder(
      itemBuilder: (context, index) {
        return new Align(
          alignment: index.isEven ? Alignment.centerLeft : Alignment.centerRight,
          child: new Card(
            child: new Padding(
              padding: const EdgeInsets.all(8.0),
              child: new Text("Hello World $index"),
            ),
          ),
        );
      },
    ));
  }
}