Welcome toVigges Developer Community-Open, Learning,Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.5k views
in Technique[技术] by (71.8m points)

dart - Flutter position fixed equivalent

Is it possible to fix an object in the screen that stays fixed regardless of scrolling?

Something similar to CSS position fixed.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can absolutely position a child of a Stack widget using the Positioned widget.

The minimal example below places the red box above the list view, by placing the child in a Positioned widget after the ListView in the Stack's children.

List<String> todos = [...];
return new Stack(
  children: <Widget>[
    new ListView(
     children: todos
       .map((todo) => new ListTile(title: new Text(todo)))
       .toList(),
     ),
     new Positioned(
       left: 30.0,
       top: 30.0,
       child: new Container(
         width: 100.0,
         height: 80.0,
         decoration: new BoxDecoration(color: Colors.red),
         child: new Text('hello'),
        )
      ),
   ],
);

And here it is inside of a Scaffold body. If you add more items you'll find that the list scrolls without moving the red box.

an absolutely positioned example


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to Vigges Developer Community for programmer and developer-Open, Learning and Share

2.1m questions

2.1m answers

63 comments

56.6k users

...