Flutter - 不要用文本和容器包裹
Flutter - do not wrap with text and container
我有这个代码:
import 'package:flutter/material.dart';
void main() => runApp(mainApp());
class mainApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const MaterialApp(
home: Chat(),
);
}
}
class Chat extends StatefulWidget {
const Chat({Key? key}) : super(key: key);
@override
_ChatState createState() => _ChatState();
}
class _ChatState extends State<Chat> {
List<InlineSpan> myList = [
TextSpan(text: 'Hello, my name '),
WidgetSpan(
child: Container(
color: Colors.orange,
child: GestureDetector(
onTap: () {
print('tap');
},
child: Container(
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Text(
'is',
style: TextStyle(fontSize: 25.0),
),
),
),
),
),
),
TextSpan(text: ' Gabriele, and i am 21 years old!'),
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: RichText(
text: TextSpan(
style: TextStyle(fontSize: 25.0, color: Colors.black),
children: myList,
),
),
),
);
}
}
这是我当前的输出:
如图所示,'is' 一词(以橙色突出显示)略微向上移动。
我怎样才能让它和其他词处于同一水平?
(例如,关于水平轴对齐中心的所有内容..)
.
希望你能帮帮我。
谢谢:)
这可能是因为您正在使用 Padding
并且您设置了
padding: const EdgeInsets.all(4.0)
试试这个
padding: const EdgeInsets.only(left: 4, right: 4, top: 4)
我有这个代码:
import 'package:flutter/material.dart';
void main() => runApp(mainApp());
class mainApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const MaterialApp(
home: Chat(),
);
}
}
class Chat extends StatefulWidget {
const Chat({Key? key}) : super(key: key);
@override
_ChatState createState() => _ChatState();
}
class _ChatState extends State<Chat> {
List<InlineSpan> myList = [
TextSpan(text: 'Hello, my name '),
WidgetSpan(
child: Container(
color: Colors.orange,
child: GestureDetector(
onTap: () {
print('tap');
},
child: Container(
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Text(
'is',
style: TextStyle(fontSize: 25.0),
),
),
),
),
),
),
TextSpan(text: ' Gabriele, and i am 21 years old!'),
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: RichText(
text: TextSpan(
style: TextStyle(fontSize: 25.0, color: Colors.black),
children: myList,
),
),
),
);
}
}
这是我当前的输出:
如图所示,'is' 一词(以橙色突出显示)略微向上移动。
我怎样才能让它和其他词处于同一水平? (例如,关于水平轴对齐中心的所有内容..)
.
希望你能帮帮我。
谢谢:)
这可能是因为您正在使用 Padding
并且您设置了
padding: const EdgeInsets.all(4.0)
试试这个
padding: const EdgeInsets.only(left: 4, right: 4, top: 4)