日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后，達者為師

網站首頁 編程語言 正文

Flutter框架解決盒約束widget和assets里加載資產技術_Android

作者：黎燃 ? 更新時間： 2023-01-28 編程語言

盒約束

flutter:
  assets:
    - assets/my_icon.png
    - assets/background.png

在Flutter中，小部件由其底層RenderBox對象渲染。渲染框受其父對象的約束，并在這些約束下調整自身大小。約束包括最小寬度、最大寬度和高度；尺寸由特定的寬度和高度組成。 通常，根據小部件如何處理其約束，有三種類型的框： 盡可能大。例如，“Center”和“ListView”的渲染框 遵循子部件的大小。例如，“變換”和“不透明度”渲染框。 指定尺寸。例如，圖像和文本的渲染框 一些小部件（如Container）將根據構造函數參數而變化。默認情況下，容器占用盡可能多的空間，但如果為其指定寬度，它將采用指定的值。

import 'dart:async' show Future;
import 'package:flutter/services.dart' show rootBundle;
Future<String> loadAsset() async {
  return await rootBundle.loadString('assets/config.json');
}

其他，如行和列（彈性框），將根據給它們的約束而變化，如下面的“flex”部分所述。 這些約束有時是“緊”的，這意味著它們不會為渲染框留出空間來確定其自身的大?。ɡ?，如果最小寬度和最大寬度相同，即寬度很窄）。主要示例是App小部件，它是RenderView類中包含的一個小部件：應用程序構建函數返回的子小部件的渲染框被分配了一個約束，迫使它精確地填充應用程序的內容區域（通常是整個屏幕）。Flutter中的許多框，特別是那些只包含一個子控件的框，會將其約束傳遞給其子控件。這意味著，如果在應用程序渲染樹的根處嵌套一些框，則所有子節點都受這些渲染框的約束。 有些框是放松的，有“最大”約束，但沒有“最小”約束。例如，中心。

 new AssetImage('icons/heart.png', package: 'my_icons')

文本輸入widget

class ExampleWidget extends StatefulWidget {
  ExampleWidget({Key key}) : super(key: key);
  @override
  _ExampleWidgetState createState() => new _ExampleWidgetState();
}

TextField是最常用的文本輸入小部件 默認情況下，TextField具有下劃線裝飾。通過將InputDecoration設置為裝飾屬性，可以添加標簽、圖標、提示文本和錯誤文本。要完全刪除裝飾（包括下劃線和為標簽保留的空間），請將裝飾明確設置為空白。

TextFormField包裝一個TextField并將其集成到表單中。需要提供一個驗證函數來檢查用戶的輸入是否滿足某些限制（例如，電話號碼），或者在希望將TextField與其他FormField集成時使用TextFormField。

class _ExampleWidgetState extends State<ExampleWidget> {
  final TextEditingController _controller = new TextEditingController();
  @override
  Widget build(BuildContext context) {
    return new Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        new TextField(
          controller: _controller,
          decoration: new InputDecoration(
            hintText: 'Type something',
          ),
        ),
        new RaisedButton(
          onPressed: () {
            showDialog(
              context: context,
              child: new AlertDialog(
                title: new Text('What you typed'),
                content: new Text(_controller.text),
              ),
            );
          },
          child: new Text('DONE'),
        ),
      ],
    );
  }
}

assets

資產部分的顫振部分指定應用程序中應包含的文件。每個資產都由相對于pubspec.yaml文件位置的顯式路徑標識。資產的申報順序無關緊要。資產的實際目錄可以是任何文件夾（本例中為資產）。 在構建過程中，Flutter將資產放在一個稱為資產包的特殊歸檔中，應用程序可以在運行時讀取該歸檔。 資產變體 構建過程支持資產變體的概念：不同版本的資產可以在不同的上下文中顯示。當在pubspec.yaml的assets部分中指定資產路徑時，在構建過程中，將在相鄰子目錄中找到任何同名文件。然后，這些文件將與指定的資產一起包含在資產包中。

import 'dart:async' show Future;
import 'package:flutter/services.dart' show rootBundle;
Future<String> loadAsset() async {
  return await rootBundle.loadString('assets/config.json');
}

加載資產

應用程序可以通過AssetBundle對象訪問其資產。 有兩種主要方法允許從資產包加載字符串/文本（loadString）或圖像/二進制（load）。 加載文本資源 每個Flutter應用程序都有一個rootBundle對象，可以輕松訪問主資源包?？梢灾苯邮褂冒械娜朱o態rootBundle對象：flutter/services。部件以加載資產。

但是，建議使用DefaultAssetBundle獲取當前BuildContext的AssetBundle。此方法不使用應用程序構建的默認資產捆綁包，但允許父小部件在運行時替換不同的資產捆綁包（這對于本地化或測試場景非常有用）。

 new AssetImage('icons/heart.png', package: 'my_icons')

通常，可以使用DefaultAssetBundle。of（）從應用程序運行時加載資產（如JSON文件）。 可以使用rootBundle直接在Widget上下文外加載這些資產，或者當AssetBundle的句柄不可用時，

Widget build(BuildContext context) {
  // ...
  return new DecoratedBox(
    decoration: new BoxDecoration(
      image: new DecorationImage(
        image: new AssetImage('graphics/background.png'),
        // ...
      ),
      // ...
    ),
  );
  // ...
}

原文鏈接：https://juejin.cn/post/7179621762672525371

欄目分類
最近更新