entityMap|blocks|key|6f676|text|它必须是容器边界吗？如果没有，您可以将TextField与InputDecoration一起使用，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|9hfft|TextField(
+++++decoration:+InputDecoration(
+++++++++border:+OutlineInputBorder(),
+++++++++labelText:+'Label+Text',
+++++),
+++++textAlign:+TextAlign.center,
),|code-block|syntax|javascript|5ee8b|但遗憾的是，TextField不支持居中的标签文本(textAlign:+TextAlign.center,只支持居中的提示文本)。如果要使标签文本居中，则必须更改TextField.dart。|offset|length|style|CODE|f1ura|这是TextField，所以它不像通常的Text，因为它是可编辑的。如果您希望它类似于文本，请设置enabled:+false，并为其指定一个控制器，然后设置一个初始值。或者你可以使用TextFormField，这样你就不必使用控制器了。如下所示：|5vibn|TextFormField(
++++decoration:+InputDecoration(
++++++++border:+OutlineInputBorder(),
++++++++labelText:+'Address',
++++),
++++textAlign:+TextAlign.center,
++++enabled:+true,
++++initialValue:+'Address+Here',
),|9rocq^0|0|0|Q|S|2A|E|0|2|9|K|4|1D|E|2K|D|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|S|9|@]|A|@]|B|$]]|$2|C|4|D|6|E|8|T|9|@]|A|@]|B|$F|G]]|$2|H|4|I|6|7|8|U|9|@$J|V|K|W|L|M]|$J|X|K|Y|L|M]]|A|@]|B|$]]|$2|N|4|O|6|7|8|Z|9|@$J|10|K|11|L|M]|$J|12|K|13|L|M]|$J|14|K|15|L|M]|$J|16|K|17|L|M]]|A|@]|B|$]]|$2|P|4|Q|6|E|8|18|9|@]|A|@]|B|$F|G]]|$2|R|4|-4|6|7|8|19|9|@]|A|@]|B|$]]]]

Does it have to be the container border? If not, you can use the TextField with InputDecoration like this:

<pre><code>TextField(
 decoration: InputDecoration(
 border: OutlineInputBorder(),
 labelText: 'Label Text',
 ),
 textAlign: TextAlign.center,
),
</code></pre>

But Sadly the TextField dose not support the centered label text (<code>textAlign: TextAlign.center,</code> only centers the hint text). If you want to center the label text you have to change the <code>TextField.dart</code>. 

This is <code>TextField</code> so it's not like a usual <code>Text</code> because it is editable. If you want it to be like a Text,set <code>enabled: false</code> and give a controller to it and set an initial value. Or you can use <code>TextFormField</code> so you don't have to use a controller. Like this:

<pre><code>TextFormField(
 decoration: InputDecoration(
 border: OutlineInputBorder(),
 labelText: 'Address',
 ),
 textAlign: TextAlign.center,
 enabled: true,
 initialValue: 'Address Here',
),
</code></pre>

entityMap|0|type|IMAGE|mutability|IMMUTABLE|data|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/53371967324e83d0c9c5e63bf4398fc1.png|imageAlt|blocks|key|1qbhn|text|这是你想要的吗？|unstyled|depth|inlineStyleRanges|entityRanges|ebpm4|​|c8vpe|?|atomic|offset|length|2cgbk|f739i|class+MainPage+extends+StatefulWidget+{
++@override
++_MainPageState+createState()+=>+_MainPageState();
}

class+_MainPageState+extends+State<MainPage>+{
++FocusNode+focusNode+=+FocusNode();
++bool+isFocused+=+false;

++@override
++void+initState()+{
++++focusNode.addListener(_onFocusChange);
++++super.initState();
++}

++void+_onFocusChange()+{
++++setState(()+=>+isFocused+=+!isFocused);
++}

++@override
++Widget+build(BuildContext+context)+{
++++return+Scaffold(
++++++body:+Container(
++++++++margin:+const+EdgeInsets.symmetric(horizontal:+500,+vertical:+300),
++++++++child:+Stack(
++++++++++children:+<Widget>[
++++++++++++Container(
++++++++++++++padding:+const+EdgeInsets.only(top:+10),
++++++++++++++child:+TextFormField(
++++++++++++++++focusNode:+focusNode,
++++++++++++++++decoration:+InputDecoration(
++++++++++++++++++border:+OutlineInputBorder(
++++++++++++++++++++++borderRadius:+BorderRadius.circular(30)),
++++++++++++++++),
++++++++++++++),
++++++++++++),
++++++++++++Align(
++++++++++++++alignment:+Alignment.topCenter,
++++++++++++++child:+Container(
++++++++++++++++color:+Colors.white,
++++++++++++++++child:+Padding(
++++++++++++++++++padding:+const+EdgeInsets.symmetric(horizontal:+8.0),
++++++++++++++++++child:+Text(
++++++++++++++++++++'Address',
++++++++++++++++++++style:
++++++++++++++++++++++++isFocused+?+TextStyle(color:+Colors.blue[800])+:+null,
++++++++++++++++++),
++++++++++++++++),
++++++++++++++),
++++++++++++),
++++++++++],
++++++++),
++++++),
++++);
++}
}|code-block|syntax|javascript|8au50|据我所知，没有办法在InputDecoration中以labelText为中心。|2l9qu^0|0|0|0|1|0|0|0|0|0^^$0|$1|$2|3|4|5|6|$7|8|9|-4]]]|A|@$B|C|D|E|2|F|G|Z|H|@]|I|@]|6|$]]|$B|J|D|K|2|F|G|10|H|@]|I|@]|6|$]]|$B|L|D|M|2|N|G|11|H|@]|I|@$O|12|P|13|B|14]]|6|$]]|$B|Q|D|K|2|F|G|15|H|@]|I|@]|6|$]]|$B|R|D|S|2|T|G|16|H|@]|I|@]|6|$U|V]]|$B|W|D|X|2|F|G|17|H|@]|I|@]|6|$]]|$B|Y|D|-4|2|F|G|18|H|@]|I|@]|6|$]]]]

Is this what you want?

<a href="https://i.stack.imgur.com/TJ2Aa.png" rel="noreferrer"><img src="https://i.stack.imgur.com/TJ2Aa.png" alt="enter image description here"></a>

<pre><code>class MainPage extends StatefulWidget {
 @override
 _MainPageState createState() =&gt; _MainPageState();
}

class _MainPageState extends State&lt;MainPage&gt; {
 FocusNode focusNode = FocusNode();
 bool isFocused = false;

 @override
 void initState() {
 focusNode.addListener(_onFocusChange);
 super.initState();
 }

 void _onFocusChange() {
 setState(() =&gt; isFocused = !isFocused);
 }

 @override
 Widget build(BuildContext context) {
 return Scaffold(
 body: Container(
 margin: const EdgeInsets.symmetric(horizontal: 500, vertical: 300),
 child: Stack(
 children: &lt;Widget&gt;[
 Container(
 padding: const EdgeInsets.only(top: 10),
 child: TextFormField(
 focusNode: focusNode,
 decoration: InputDecoration(
 border: OutlineInputBorder(
 borderRadius: BorderRadius.circular(30)),
 ),
 ),
 ),
 Align(
 alignment: Alignment.topCenter,
 child: Container(
 color: Colors.white,
 child: Padding(
 padding: const EdgeInsets.symmetric(horizontal: 8.0),
 child: Text(
 'Address',
 style:
 isFocused ? TextStyle(color: Colors.blue[800]) : null,
 ),
 ),
 ),
 ),
 ],
 ),
 ),
 );
 }
}
</code></pre>

As far as I know there is no way to centerized labelText in InputDecoration.

I want to add the text through a container border in flutter. 
<a href="https://i.stack.imgur.com/MBsFW.png" rel="noreferrer"><img src="https://i.stack.imgur.com/MBsFW.png" alt="enter image description here"></a>

I just want that Address to appear through a gap between the top border. It doesn't seem possible using a positioned widget, because then the border lines would appear through the "Address" text. 

Is it at all possible?

Text through border in flutter

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

 我想在flutter中通过容器边框添加文本。 ? ​ 我只想让这个地址出现在顶部边框之间的空隙中。使用定位的小部件似乎不太可能，因为这样边框线就会通过"Address“文本出现。 这有可能吗？ 

问在颤动中通过边框的文本
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在颤动中通过边框的文本EN