flutter – Records And Memorys

第一个连接是设置颜色

第二个是怎么弹出

June 3, 2021June 9, 2021

mac 怎么用wireshark抓 flutter web开发网页的包-chrome

wireshark 版本 Version 3.4.5

mac。版本 11.3.1

在。/users/mac/documents 新建一个文件权限777 ， sslkeylog.log

wireshark 这样设置

命令行执行： /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome –user-data-dir=/tmp/chrome –ssl-key-log-file=/users/mac/documents/sslkeylog.log

会启动一个新的chrome。然后打开wireshark 就能抓包到这个chrome 的http和 https 包

但是。flutter 启动web的方法是：

flutter run -d chrome

这种方法怎么带参数，比如像这样：

flutter-web-admin-dashboard-ecommerce-main % flutter run -d chrome –chrome-args=”–user-data-dir=/tmp/chrome –ssl-key-log-file=/users/mac/documents/sslkeylog.log”

这个网页提出的同样的问题： https://github.com/dart-lang/webdev/issues/1080

解决方法是：先用flutter run -d chrome 运行，然后用这个命令打开的chrome

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome –user-data-dir=/tmp/chrome –ssl-key-log-file=/users/mac/documents/sslkeylog.log

打开flutter 网页的地址

May 24, 2021May 24, 2021

flutter how to add getx package to exist project

先安装package

get: ^4.1.4

1	get: ^4.1.4

运行

flutter pub get -v

1	flutter pub get -v

get package

执行

flutter pub global activate get_cli

1	flutter pub global activate get_cli

启动 cli 工具

执行

get -v

get -v

看是否显示getx的版本，能正确显示版本说明到此为止正确

比如现有的目录是这样的 /lib/widgets/layout/sms.dart

想给sms.dart文件加一个controller ，可以执行：

get create controller:bulksms  on widgets/layoutget

1	get create controller:bulksms on widgets/layoutget

以上命令来自于：https://github.com/jonataslaw/get_cli

May 13, 2021

flutter 怎么让datatable 也能自适应宽度

SizedBox.expand results in the DataTable taking an infinite height which the SingleChildScrollView won’t like. Since you only want to span the width of the parent, you can use a LayoutBuilder to get the size of the parent you care about and then wrap the DataTable in a ConstrainedBox.

Widget build(BuildContext context) {
  <span class="hljs-keyword">return</span> Scaffold(
    body: LayoutBuilder(
      builder: (context, constraints) =&gt; SingleChildScrollView(
        child: Column(
          children: [
            <span class="hljs-keyword">const</span> Text(<span class="hljs-string">'My Text'</span>),
            Container(
              alignment: Alignment.topLeft,
              child: SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: ConstrainedBox(
                  constraints: BoxConstraints(minWidth: constraints.minWidth),
                  child: DataTable(columns: [], rows: []),
                ),
              ),
            ),
          ],
        ),
      ),
    ),
  );
}

Widget build(BuildContext context) {

return Scaffold(

body: LayoutBuilder(

builder: (context, constraints) => SingleChildScrollView(

child: Column(

children: [

const Text('My Text'),

Container(

alignment: Alignment.topLeft,

child: SingleChildScrollView(

scrollDirection: Axis.horizontal,

child: ConstrainedBox(

constraints: BoxConstraints(minWidth: constraints.minWidth),

child: DataTable(columns: [], rows: []),

);

}

来自网站： https://stackoverflow.com/questions/56625052/how-to-make-a-multi-column-flutter-datatable-widget-span-the-full-width

May 11, 2021May 11, 2021

如何检查flutter textfield 是否包含unicode字符

string.codeUnits is an array of Unicode UTF-16 code units. So i would say it could be like

int maxLengthOfTextField(String text){
  final int maxBits = 128;
  List<int> unicodeSymbols = text.codeUnits.where((ch) => ch > maxBits ).toList();
  return unicodeSymbols.length > 0 ? 160 : 70;
}

final textFieldController = TextEditingController();
TextField(
  controller: textFieldController,
  maxLength: maxLengthOfTextField(textFieldController.text)
);

string.codeUnits is an array of Unicode UTF-16 code units. So i would say it could be like

int maxLengthOfTextField(String text){

final int maxBits = 128;

List<int> unicodeSymbols = text.codeUnits.where((ch) => ch > maxBits ).toList();

return unicodeSymbols.length > 0 ? 160 : 70;

}

final textFieldController = TextEditingController();

TextField(

controller: textFieldController,

maxLength: maxLengthOfTextField(textFieldController.text)

);

来源于网站： https://stackoverflow.com/questions/55607305/how-can-i-check-if-a-textfield-contains-unicode-characters-in-flutter-dart

修改后成为：

            child: TextField(
                decoration: InputDecoration(
                  hintStyle: TextStyle(fontSize: 17),
                  hintText: 'Search your trips',
                  // suffixIcon: Icon(Icons.search),
                  counterText: "",
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.all(20),
                ),
                maxLength: 480,
                controller: textController,
                onChanged: _onChanged,
              ),

child: TextField(

decoration: InputDecoration(

hintStyle: TextStyle(fontSize: 17),

hintText: 'Search your trips',

// suffixIcon: Icon(Icons.search),

counterText: "",

border: InputBorder.none,

contentPadding: EdgeInsets.all(20),

maxLength: 480,

controller: textController,

onChanged: _onChanged,

  _onChanged(String value) {
    // print(value);
    final int maxBits = 128;
    List<int> unicodeSymbols = value.codeUnits.where((ch) => ch > maxBits ).toList();
    if(unicodeSymbols.length > 0)
    {
      setState(() {
        ifContainUnicode = "unicode";
      });
    }
    else
    {

      setState(() {
        ifContainUnicode = "bit";
      });
    }

    setState(() {
      charLength = value.length;
    });
  }

_onChanged(String value) {

// print(value);

final int maxBits = 128;

List<int> unicodeSymbols = value.codeUnits.where((ch) => ch > maxBits ).toList();

if(unicodeSymbols.length > 0)

{

setState(() {

ifContainUnicode = "unicode";

});

}

else

{

setState(() {

ifContainUnicode = "bit";

});

}

setState(() {

charLength = value.length;

});

}

这个网址也可以看一下； https://dev.to/stack-labs/flutter-utf8-textfield-length-limiter-and-char-counter-31o7

April 16, 2021June 9, 2021

如何用flutter做web

flutter config --enable-web

1

flutter config --enable-web

这个命令是启动web 开发

查看当前channel

flutter channel

1	flutter channel

切换channel

flutter channel masters

1	flutter channel masters

顺序是：先切换channel 再启动web
左边导航条怎么实现子菜单

https://stackoverflow.com/questions/45559580/expansion-panel-list-in-flutter

怎么在网页上画图表

https://whereisdarran.com/2020/02/charts-for-flutter-and-flutter-web/

怎么执行js

https://medium.com/flutter-community/using-javascript-code-in-flutter-web-903de54a2000

https://fireship.io/snippets/using-js-with-flutter-web/

画table 和带换页的table

https://medium.com/codechai/flutter-web-and-paginateddatatable-3779da7683e

怎么画bootstrap 风格的页面

bootstrap就是指网页能随着缩放拉伸，自动适应设备的大小，布局可能随页面的大小而变

用这个package ： responsive_builder: ^0.3.0

————–

以下是仿 movider

March 9, 2021

flutter后台服务，当收到sms时进行处理

监控sms的plugin ：

https://pub.dev/packages/telephony

March 9, 2021March 9, 2021

flutter 如何创建或引用本地另外的package

此问题的解答见：

https://stackoverflow.com/questions/51238420/how-to-use-local-flutter-package-in-another-flutter-application

把本地package 根目录和 app的根目录并列，然后在 app的 .yaml 文件加：

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^0.1.2 #This is an asset repo containing the default set of icon assets used by Flutter's Cupertino widgets
<span style="color: #ff0000;">  paowuxiangame:
    path: ../paowuxiangame</span>

dependencies:

flutter:

sdk: flutter

cupertino_icons: ^0.1.2 #This is an asset repo containing the default set of icon assets used by Flutter's Cupertino widgets

paowuxiangame:

path: ../paowuxiangame

红字部分即为本地package

,当需要使用时：引用方法为：

import 'package:paowuxiangame/paowuxiangame.dart';

1	import 'package:paowuxiangame/paowuxiangame.dart';

未解决问题： package 的assets无法在app使用

如何创建一个package：

flutter create --template=package hello

1	flutter create --template=package hello

官方教程： https://flutter.dev/docs/development/packages-and-plugins/developing-packages

medium 教程： https://medium.com/flutterdevs/developing-packages-in-flutter-61a31acf616d

plugin是处理平台相关的特殊package

package 是否可以带ui？可以

March 2, 2021March 17, 2021

从2021-3-2起，开始模仿一个鱼丸星球的app

2021-03-02

DONE : 底部导航条

用flutter_screenutil 这个package 实现自适应屏幕大小

TODO: appbar 加上搜索条，参考文章： https://flutter.website/flutter-app-bar-and-search-widget-integrated/

2021-03-03

TODO : 实现从webservice 取回 json，生成listview ，并进一步实现 pull — to — refresh 功能，也就是先载入例如 20条，当用户向下拉到20条的底部时，继续载入下20条

参考文章： https://medium.com/@maffan/implementing-pull-to-refresh-in-flutter-59dd31239624

先定义用户模型：

新建此项目所用的node.js server ，步骤

1 ： mkdir yuwanxingqiunodejs

2: npm init

3: npm install express –save 安装 express.js

2021-03-04

2021-03-09 周二

如何实现实时音频： https://www.infoq.cn/article/zsh1smytbrvclz579sou

这个链接讲怎么用声网sdk实现 ,

原生安卓怎么对实时音频编码解码：

https://stackoverflow.com/questions/15349987/stream-live-android-audio-to-server

https://stackoverflow.com/questions/21804390/pcm-aac-encoder-pcmdecoder-in-real-time-with-correct-optimization

2021-03-10

建mysql数据库：

 create table users (id INT NOT NULL AUTO_INCREMENT,createtime DATETIME,male VARCHAR(255),age int, sign VARCHAR(255), picture MEDIUMBLOB,PRIMARY KEY(id ));

1	create table users (id INT NOT NULL AUTO_INCREMENT,createtime DATETIME,male VARCHAR(255),age int, sign VARCHAR(255), picture MEDIUMBLOB,PRIMARY KEY(id ));

写入数据；

INSERT INTO users(createtime, male, age, sign) VALUES( NOW(), 'male', 22, 'hello world');

1	INSERT INTO users(createtime, male, age, sign) VALUES( NOW(), 'male', 22, 'hello world');

INSERT INTO RESOURCES(ID, NAME, RESTYPE, CONTENT) VALUES
  ('4',
  'Printer.TicketTotal',
  0, 
  LOAD_FILE('/home/anand/Openbravo-POS/main/src-pos/com/openbravo/pos/templates/Printer.TicketTotal.xml'));

INSERT INTO RESOURCES(ID, NAME, RESTYPE, CONTENT) VALUES

('4',

'Printer.TicketTotal',

LOAD_FILE('/home/anand/Openbravo-POS/main/src-pos/com/openbravo/pos/templates/Printer.TicketTotal.xml'));

node.js 怎么连mysql ： https://www.w3schools.com/nodejs/nodejs_mysql.asp

var mysql = require('mysql');

var con = mysql.createConnection({
  host: "localhost",
  user: "yourusername",
  password: "yourpassword"
});

con.connect(function(err) {
  if (err) throw err;
  console.log("Connected!");
});

var mysql = require('mysql');

var con = mysql.createConnection({

host: "localhost",

user: "yourusername",

password: "yourpassword"

});

con.connect(function(err) {

if (err) throw err;

console.log("Connected!");

});

怎么建一个node.js service ，允许用户上传图片到服务器，并把图片的路径存在mysql

例子： https://www.js-tutorials.com/nodejs-tutorial/nodejs-example-upload-store-image-mysql-express-js/

例子的代码： https://github.com/jstutorials/nodejs_image_upload_and_store_mysql

nodejs_image_upload_and_store_mysql-master

****. 成功测试出如何上传图片到服务器

2021-03-11 周四

问题： centos 6 ， git当前版本1.7.1 ，当 git push 时遇到 401错误，如何升级git

既然昨天可以往服务器存图片，那么从服务器取用户 list 就可能

node.js 查询mysql数据库，返回json： https://www.jianshu.com/p/6af5448c380a

node.js 怎么提供文件服务器功能，此问题已经有人提出过，在这个网址：

https://stackoverflow.com/questions/16333790/node-js-quick-file-server-static-files-over-http

解决方法是这个：加一句：

app.use('/', express.static(__dirname + '/public'));

1	app.use('/', express.static(__dirname + '/public'));

即可

把某个文件夹变成文件服务器之后，就可以用这样的url：

http://176.122.178.74:8080/images/upload_images/fruit_bubble.png

来访问文件

2021-03-12. 周五

当用户以http从服务器取回数据时，怎么把json解析为object list： https://stackoverflow.com/questions/51053954/how-to-deserialize-a-list-of-objects-from-json-in-flutter

得到object list以后，怎么用futurebuilder动态生成ListView？

https://stackoverflow.com/questions/56694731/flutter-listview-builder-using-futurebuilder-not-working

接下来是怎么实现 scroll-to-refresh ，就是当第一次加载比如20条之后，当用户到达底部后再次向下scroll，那么再多加载20条。

https://medium.com/@maffan/implementing-pull-to-refresh-in-flutter-59dd31239624

2021-03-17 周三

试着加上用户profile页面

January 8, 2021

flutter 给程序加退出确认

https://stackoverflow.com/questions/59123262/how-to-show-confirm-dialog-before-leave-screen-in-flutter

Category: flutter

flutter 用 showmenu函数显示弹出菜单并设置背景颜色

mac 怎么用wireshark抓 flutter web开发网页的包-chrome

flutter how to add getx package to exist project

flutter 怎么让datatable 也能自适应宽度

如何检查flutter textfield 是否包含unicode字符

如何用flutter做web

flutter后台服务，当收到sms时进行处理

flutter 如何创建或引用本地另外的package

从2021-3-2起，开始模仿一个鱼丸星球的app

flutter 给程序加退出确认