本文用以記錄我在用flutter中遇到的一些小bug及解決辦法

功能型

設計三寶： 圓角，陰影加漸變

實際代碼根據(jù)參數(shù)微調即可

Container(
      margin: EdgeInsets.only(right: 3),
      decoration: BoxDecoration(
          // 圓角， 只設置左上和右下
          borderRadius: BorderRadius.only(
              topLeft: Radius.circular(5), bottomRight: Radius.circular(5)),
          // 漸變 上到下
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [
              Color(0xFF79ACFB),
              Color(0xFF4474F5),
            ],
          ),
          // 陰影 (3, 3) 右下陰影 (-3, 0)  左邊陰影，blurRadius 模糊半徑
          boxShadow: [
            BoxShadow(
                color: Color(0x10888888), offset: Offset(3, 3), blurRadius: 4),
            BoxShadow(
                color: Color(0x10888888), offset: Offset(-3, 0), blurRadius: 6)
          ]),
      height: 20,
      width: 35,
      child: Center(),
    );

收起鍵盤

關鍵代碼：FocusScope.of(context).requestFocus(FocusNode());
點擊空白區(qū)域收起鍵盤：

GestureDetector(
    behavior: HitTestBehavior.translucent,
    onTap: () {
        // 觸摸收起鍵盤
        FocusScope.of(context).requestFocus(FocusNode());
    },
    child: Container()
) 

Flutter 輸入控件TextField設置內容并保持光標(cursor)在末尾

關鍵代碼：

selection: TextSelection.fromPosition(
            TextPosition(
                affinity: TextAffinity.downstream, offset: inputText.length),
          ),

實用代碼：

TextField(
      controller: TextEditingController.fromValue(
        TextEditingValue(
          // 設置內容
          text: inputText,
          // 保持光標在最后
          selection: TextSelection.fromPosition(
            TextPosition(
                affinity: TextAffinity.downstream, offset: inputText.length),
          ),
        ),
      ),
    );

輸入框文案不居中

關鍵代碼：
textAlignVertical: TextAlignVertical.center,
例子

TextField(
  textAlignVertical: TextAlignVertical.center,
  textAlign: TextAlign.left,
  controller: textController,
   obscureText: false,
   style: TextStyle(fontSize: 15),
   keyboardType: TextInputType.text,
   textInputAction: TextInputAction.search,
   maxLines: 1,
   cursorColor: Argb.theme,
   decoration: InputDecoration(
   border: InputBorder.none,
   hintText: '搜索客戶姓名或手機號',
   hintStyle: TextStyle(
     fontSize: 15,
       color: Argb.c88,
      ),
  counterText: "",
      ),
  onSubmitted: (value) {
       keyStr = value;
         _onRefresh();
      },
  onChanged: _onChange,
  )

bug型

iOS通道錯誤

錯誤描述：
Unexpectedly found nil while implicitly unwrapping an Optional value: file ../MQDownloadDetailVC.swift, line 62
字面意思，可選類型為空，實際代碼
關鍵代碼

open class MQDownloadDetailVC: MQBaseViewController {
    open var filePath = "" {
        didSet {
            rightItemTitle = "分享"
            print("filePath =========== \(filePath)")
            let url = URL(fileURLWithPath: filePath)
            let request = URLRequest(url: url)

            webV.load(request) // 62 行
        }
    }

  var webV: WKWebView!

  override open func viewDidLoad() {
        super.viewDidLoad()
        initViews()
        setupViews()
        bindRx()
    }

  func initViews() {
    webV = {
        let webV = WKWebView()
        webV.scrollView.delegate = self
        webV.scrollView.bounces = false
        webV.navigationDelegate = self
        return webV
    }()
  }
}

此處的nil指的不是 request 而是 webV,之前是用原生的，用nav push 到這個vc, 但是 viewDidLoad 是在push 之后，而我又是先給 filePath 賦的值。故此處 webV 為空。

修正后代碼:

/// 需要先有webV
    open var filePath = "" {
        didSet {
            rightItemTitle = "分享"
            print("filePath =========== \(filePath)")
            let url = URL(fileURLWithPath: filePath)
            let request = URLRequest(url: url)

            webV.load(request) // 62 行
        }
    }

lazy var webV: WKWebView = {
        let webV = WKWebView()
        webV.scrollView.delegate = self
        webV.scrollView.bounces = false
        webV.navigationDelegate = self
        return webV
    }()