Question

我正在尝试输入一些字段，但似乎无法正确设置高度。顶部的高度很好，但是文本偏移了。我试图更改文本样式的高度，但是没有用。我试图更改容器的高度，但使文本偏移了。我试图更改文字高度，但不起作用。我该怎么办？

  Container
  (
    width: 200,
    height: 40,
    child: TextFormField
    (
      keyboardType: TextInputType.phone,
      style: Theme.of(context).textTheme.body1,
      decoration: InputDecoration
      (
        hintText: 'Enter your name',
        hintStyle: Theme.of(context).textTheme.body1,
        border: OutlineInputBorder
        (
          borderSide: BorderSide
          (
            color: Theme.of(context).primaryColor, 
            width: 2.0,
          ),
        ),
        enabledBorder: OutlineInputBorder
        (
          borderSide: BorderSide
          (
            color: Theme.of(context).primaryColor, 
            width: 2.0,
          ),
        )
      ),
      validator: (value) {
        return value.isEmpty ? 'Please enter your name' : null;
      },
    ),
  ),
  SizedBox(height: 10,),
  Container
  (
    width: 200,
    child: TextFormField(
      keyboardType: TextInputType.phone,
      style: Theme.of(context).textTheme.body1,
      decoration: InputDecoration(
        hintText: 'Enter your phone number',
        hintStyle: Theme.of(context).textTheme.body1,
        border: OutlineInputBorder
        (
          borderSide: BorderSide
          (
            color: Theme.of(context).primaryColor, 
            width: 2.0,
          ),
        ),
        enabledBorder: OutlineInputBorder
        (
          borderSide: BorderSide
          (
            color: Theme.of(context).primaryColor, 
            width: 2.0,
          ),
        )
      ),
      validator: (value) {
        return value.isEmpty ? 'Please enter your phone number' : null;
      },
    ),
  ),

Answer 1

出现偏移量是因为您将容器的高度设置为小于TextField的最小高度。您可以通过增加高度或减小contentPadding来解决它。像这样

Container
        (
          alignment: Alignment.bottomRight,
          width: 200,
          height: 30,
          child: TextFormField
          (
            keyboardType: TextInputType.phone,
            style: Theme.of(context).textTheme.body1,
            textAlignVertical: TextAlignVertical.center,
            decoration: InputDecoration
            (
              contentPadding: EdgeInsets.all(5),
              hintText: 'Enter your name',
              hintStyle: Theme.of(context).textTheme.body1,
              border: OutlineInputBorder
              (
                gapPadding: 0.0,
                borderSide: BorderSide
                (
                  color: Theme.of(context).primaryColor, 
                  width: 2.0,
                ),
              ),
              enabledBorder: OutlineInputBorder
              (
                gapPadding: 0.0,
                borderSide: BorderSide
                (
                  color: Theme.of(context).primaryColor, 
                  width: 2.0,
                ),
              )
            ),
            validator: (value) {
              return value.isEmpty ? 'Please enter your name' : null;
            },
          ),
        ),
        SizedBox(height: 10,),
        Container
        (
          width: 200,
          child: TextFormField(
            keyboardType: TextInputType.phone,
            style: Theme.of(context).textTheme.body1,
            decoration: InputDecoration(
              hintText: 'Enter your phone number',
              contentPadding: EdgeInsets.all(5),
              hintStyle: Theme.of(context).textTheme.body1,
              border: OutlineInputBorder
              (
                borderSide: BorderSide
                (
                  color: Theme.of(context).primaryColor, 
                  width: 2.0,
                ),
              ),
              enabledBorder: OutlineInputBorder
              (
                borderSide: BorderSide
                (
                  color: Theme.of(context).primaryColor, 
                  width: 2.0,
                ),
              )
            ),
            validator: (value) {
              return value.isEmpty ? 'Please enter your phone number' : null;
            },
          ),
        ),

Answer 2

像这样用<?php echo("PHP Search Page Loaded Successfully"); // test variables. $_POST['submit'] = true; $_POST['name'] = "bahamas"; if(isset($_POST['submit'])){ $_POST['name'] = filter_var($_POST['name'], FILTER_SANITIZE_STRING); $servername = "localhost"; $username = "test"; $password = "test"; $dbname = "test"; // Create connection $conn = new mysqli($servername, $username, $password, $dbname); // Check connection if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } else { echo("We are not dead"); } $sql = "SELECT boatname, date, price FROM liveaboards"; $result = $conn->query($sql); if ($result->num_rows > 0) { // output data of each row while($row = $result->fetch_assoc()) { echo("<br> boatname: ". $row["boatname"]. " - date: ". $row["date"]. " " . $row["price"] . "<br>"); } } else { echo(" 0 results"); } $conn->close(); }else{ echo("<p>Please enter a search query</p>"); } ?>换行：?

SizeBox

Answer 3

请尝试一下...

return MaterialApp(
  debugShowCheckedModeBanner: false,
  title: 'Flutter Demo',
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  home: Scaffold(
    body: Container(
      margin: EdgeInsets.all(10),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
            child: TextFormField(
              keyboardType: TextInputType.phone,
              style: Theme.of(context).textTheme.body1,
              decoration: InputDecoration(
                  hintText: 'Enter your name',
                  hintStyle: Theme.of(context).textTheme.body1,
                  border: OutlineInputBorder(
                    borderSide: BorderSide(
                      color: Theme.of(context).primaryColor,
                      width: 2.0,
                    ),
                  ),
                  enabledBorder: OutlineInputBorder(
                    borderSide: BorderSide(
                      color: Theme.of(context).primaryColor,
                      width: 2.0,
                    ),
                  )),
              validator: (value) {
                return value.isEmpty ? 'Please enter your name' : null;
              },
            ),
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            child: TextFormField(
              keyboardType: TextInputType.phone,
              style: Theme.of(context).textTheme.body1,
              decoration: InputDecoration(
                hintText: 'Enter your phone number',
                hintStyle: Theme.of(context).textTheme.body1,
                border: OutlineInputBorder(
                  borderSide: BorderSide(
                    color: Theme.of(context).primaryColor,
                    width: 2.0,
                  ),
                ),
                enabledBorder: OutlineInputBorder(
                  borderSide: BorderSide(
                    color: Theme.of(context).primaryColor,
                    width: 2.0,
                  ),
                ),
              ),
              validator: (value) {
                return value.isEmpty
                    ? 'Please enter your phone number'
                    : null;
              },
            ),
          ),
        ],
      ),
    ),
  ),
);

如何设置输入字段的高度？

3 个答案: