CODEWITHSUNDEEP
flutterdart
Axel
Axel

Reputation: 5111

How to hide overflowed content in flutter?

So I have a container with width 200 and height 100. Now how do I hide the overflowed content?

I tried using ClipRect and SizedOverflowBox inside Container. None of them work.

import 'package:flutter/material.dart';

main() {
  runApp(
    MaterialApp(
      home: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('A draggable card!'),
      ),
      body: Container(
        height: 100,
        width: 200,
        child: SizedOverflowBox(
          size: Size(200, 100),
          child: Column(
            children: [
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World")
            ],
          ),
        ),
      ),
    );
  }
}

Upvotes: 1

Views: 1752

Answers (1)

Abdelrahman M. Elmarakby
Abdelrahman M. Elmarakby

Reputation: 689

Instead of Column use ListView or wrap the column inside a SingleChildScrollView

Example

        height: 100,
        width: 200,
        child: SizedOverflowBox(
          size: Size(200, 100),
          child: ListView(
            children: [
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World"),
              Text("Hello World")
            ],
          ),
        ),
      ),```

Upvotes: 2

Related Questions