Flutter入门-Text Widgets

今天我们将学习怎么显示文本,并操作文本;在Flutter中,使用Text控件显示。

显示单行文本

 new Text('Text style',
   textAlign: TextAlign.center,
   style: new TextStyle(
        fontSize: 12.0,
        fontWeight: FontWeight.bold,
        color: Colors.black,),
    overflow: TextOverflow.ellipsis,
            ),

其中textAlign是用来控制文本对齐方式,style控制文本包括字体,颜色,字体大小等样式。
Text文本是没有边距的设置参数,我们使用ContainerPaddingText嵌套使用。

Container
new Container( child: new Text("Container text"),
              color: Colors.blue,
              margin: const EdgeInsets.all(5.0),
              padding: const EdgeInsets.all(5.0),),

容器Container是一个常用的控件,由基本的绘制、位置和大小控件组成。负责创建矩形的可视元素,可以用BoxDecoration来设计样式,比如背景、边框和阴影,Container也有边距、填充和大小限制等。

Padding
new Padding(child: new Text("Padding text"),
              padding: const EdgeInsets.all(5.0),),

如果只是设置文本的边距就可以使用Padding控件来实现效果。
如果想让文本控件响应Touch事件,要把该控件放在GestureDetector控件里使用。
在我们的开发中,RowColumnText使用,会被遮挡,提示如下警告:
A RenderFlex overflowed by 29 pixels on the bottom ...
不管你设置多行,还是别的还是会只显示一行。这里我们要使用Expanded控件包装每个控件。
Expanded组件可以使RowColumnFlex等子组件在其主轴方向上展开并填充可用空间(例如,Row在水平方向,Column在垂直方向)。如果多个子组件展开,可用空间会被其flex factor(表示扩展的速度、比例)分割。

显示富文本

使用RichText 可以显示丰富样式的文本。

new RichText(
  text: new TextSpan(
    text: 'Rich ',
    style: DefaultTextStyle.of(context).style,
    children: <TextSpan>[
      new TextSpan(text: 'bold', style: new TextStyle(fontWeight: FontWeight.bold)),
      new TextSpan(text: ' Text!'),
    ],
  ),
)

最后的效果如下:

Flutter入门-Hello Flutter

上节我们已经知道如何安装Flutter的环境了,这次我们简单的了解下如何创建一个Flutter项目。

创建首个Flutter项目

首先打开Android Studio,面板右部中间选择 Start a new Flutter project;
弹出New Flutter Project窗口,选择Flutter Applcation。
弹出New Flutter Applcation窗口,输入项目名Project Name,下一步。
弹出Set the package name 窗口,输入company domain(公司域名),修改package name(包名,可不修改),勾选支持语言(不会kotlin,swift可不选择)。点击完成,需要等待小会时间,我们的第一个项目工程就创建好了,见下图:

运行项目

在工程目录结构如下:

/android   Android工程目录
/ios       IOS工程目录
/lib      flutter开发目录
/test     测试目录
pubspec.yaml  flutter 依赖包管理文件

因为我们的Flutter支持跨平台,所以会生成Android,ios的工程文件。
运行项目之前,我们需要把模拟器跑起来。在Android Studio的工具栏上有一个手机的图标的按钮,点击后会弹出“open IOS simulator”的下拉选项,我们也点击就好,这时系统会打开一个IOS模拟器。
IOS模拟器启动后,就可以运行我们的程序了。点击工具栏的绿色三角,等待几分钟程序加载到模拟器中。
Material看起还是很炫的,见下图:

最近比较忙,所以只好写一篇来应付下,下周更新控件相关的内容。

Flutter入门-环境安装

最近比较热爱学习,正在学习Flutter,记录Flutter的学习过程,大家一起进步。因为博主使用Mac,以后的教程都是在mac环境下编写。

获取 Flutter SDK

获取 Flutter ,你可使用 git 去克隆Flutter的仓库然后添加 flutter 工具到你的路径,运行 flutter doctor 显示你可能要安装的依赖。
克隆仓库
如果你是第一次在你机器上安装 Flutter,克隆 beta 分支的仓库然后添加 flutter 工具到你的路径:

git clone -b beta https://github.com/flutter/flutter.git

下载Flutter SDK
因为官网提供了SDK包下载,所以我直接下了,速度也比较快。不能访问的还是使用上面获取SDK吧。
flutter_macos_v0.3.2-beta.zip

设置环境变量
Flutter路径添加到环境变量中。

export PATH=`pwd`/flutter/bin:$PATH

将以上代码添加到 ~/.bash_profile中,这样Flutter命令就可以执行。

运行Flutter doctor
运行以下命令可以看到你是否需要安装任何依赖来完成安装:

flutter doctor
我的运行结果显示如下:

~flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, v0.3.2, on Mac OS X 10.12.6 16G29, locale zh-Hans-CN)   
Android sdkmanager tool not found (/Users/jun/Documents/Developer/Android/sdk/tools/bin/sdkmanager).    
Try re-installing or updating your Android SDK, 
visit https://flutter.io/setup/#android-setup for detailed instructions.

运行Android Studio 安装Dart支持
首先你得安装了Android Studio,对于Android Studio怎么安装,大家百度,我们的教程前置条件是学习过App开发(android或IOS)。左上角菜单Preferences->Plugins,在搜索框中搜索Dart,然后安装就可以,见下图:

安装完后,重启IDE,就可以开发Flutter应用了。

PJBlog3转换wordpress4.9记录

某学长的个人blog一直使用pjblog3,然而空间一直我在打理。手上的空间,域名,网站太多了,管理起来很不方便,所以打算把pjblog转wordpress,放到以前学校论坛的服务器上。
PJBlog版本:PJBlog3 3.1.6.227
wordpress版本:WordPress 4.9.1

1.导入pjblog数据并导入wordpress

使用PJBlog3_到WordPress升迁工具导出数据,参考最新PJ3转移到WP过程详细记录——转换教程

2.内容反转义

导入wordpress的正文与摘要中的Hmtl被转义,这里需要代码编程进行反转义一下就好。

3.替换附件路径

PJBlog3的附件路径是通知download.asp访问的,在wordpress中不能访问,需要替换。
把BlogDB文件夹内的.asp结尾的文件改成.mdb后缀文件,这样就可以使用ACCESS软件打开。这里需要编程替换文件。最好把blog_Files表导出成mysql,然后在wordpress中创建这个表,导入数据。最后编程替换就好。
因为我是使用golang写的反转义与附件替换,所以没有代码可以提供。

防止Centos HHVM崩溃导致网站出现502错误

在阿里云Centos 上装了hhvm,经常会出现hhvm挂掉。这个要看hhvm的心情,有时一两天,有时一两个月都没有出现。Google了一下最简单的解决方法是写一个脚本用cron每分钟执行一次检查hhvm是否运行。
脚本如下:

#! /bin/bash
PID="`cat /var/run/hhvm/pid`"
if [ "$PID" == "" ]; then
/etc/init.d/hhvm start
if [ "`ps ax -o pid | grep $PID`" == "" ]; then
/etc/init.d/hhvm stop
/etc/init.d/hhvm start
fi
fi

将这段脚本保存在/home/check_hhvm.sh,并执行chmod +x /home/check_hhvm.sh,然后编辑/etc/crontab,加入一行

* * * * * root /home/check_hhvm.sh。

经测试,这个脚本可以让你的网站最多down一分钟。先当作临时的解决方案吧。

阿里云主机wordpress漏洞wordpress IP验证不当漏洞

漏洞描述:wordpress IP验证不当漏洞

文件位置:/wp-includes/http.php

修复方案:

在文件的465行附近的 $same_host = strtolower( $parsed_home['host'] ) === strtolower( $parsed_url['host'] );

改成 if ( isset( $parsed_home['host'] ) ) { $same_host = ( strtolower( $parsed_home['host'] ) === strtolower( $parsed_url['host'] ) || 'localhost' === strtolower( $parsed_url['host'] ) ); } else { $same_host = false; } ;

在文件的 478行附件的 if ( 127 === $parts[0] || 10 === $parts[0] || 0 === $parts[0]

改成 if ( 127 === $parts[0] || 10 === $parts[0] || 0 === $parts[0]  || 0 === $parts[0]

阿里云主机wordpress漏洞wordpress后台插件更新模块任意目录遍历导致DOS漏洞

漏洞描述:wordpress后台插件更新模块任意目录遍历导致DOS漏洞

文件位置:/wp-admin/includes/ajax-actions.php

修复方案:

在文件的2890行附近的 $plugin = urldecode( $_POST['plugin'] );

后面加上 $plugin = plugin_basename( sanitize_text_field( wp_unslash( $_POST['plugin'] ) ) );

mac升级OS X El Capitan 10.11.6 mysql 无法启动

昨天把Mac  OS X El Capitan 升级到10.11.6版本了,今天使用mysql的时候,发现连接不上数据库,phpmyadmin也不能登陆。感觉应该是mysql 没有启动,进入系统偏好设置里面发现mysql果然没有启动,点击启动,没有成功。

提示“Warning, /usr/local/mysql/data is not owned by 'mysql' or '_mysql'”

解决方法:依次执行如下命令

cd /usr/local/mysql

sudo chown -R _mysql data/

重启mysql就好了

来源去stackoverflow

 

Open a terminal:

  1. Check MySQL system pref panel, if it says something along the line "Warning, /usr/local/mysql/data is not owned by 'mysql' or '_mysql'
  2. If yes, go to the mysql folder cd /usr/local/mysql
  3. do a sudo chown -R _mysql data/
  4. This will change ownership of the /usr/local/mysql/data and all of its content to own by user '_mysql'
  5. Check MySQL system pref panel, it should be saying it's running now, auto-magically. If not start again.
  6. Another way to confirm is to do a

netstat -na | grep 3306

It should say:

tcp46 0 0 *.3306 . LISTEN

To see the process owner and process id of the mysqld:

ps aux | grep mysql

react-native init时速度特别慢,换个npm镜像就快了

在react-native init 项目的时候 ,卡的要死,几个小时都没成功,还把网速拖的好卡,完全不能上网。然后换了一个npm镜像1分钟搞定。

操作方法如下:

1.通过config命令

npm config set registry=http://registry.npm.taobao.org

2.编辑 ~/.npmrc 加入下面内容

registry = https://registry.npm.taobao.org

navigationController pushViewController 多次跳转返回

经常在做应用的时候,发现跳转的路径太深了,当我又要跳转到某个界面时,可按以下操作。

返回根页面vc用 :

[self.navigationController popToRootViewController]

返回指定的某个vc用下面(通过index定位)

[self.navigationController popToViewController:[self.navigationController.viewControllers objectAtIndex:2] animated:YES];

或(通过class定位)

for (UIViewController *controller in self.navigationController.viewControllers) {
    if ([controller isKindOfClass:[你要跳转到的Controller class]]) {
        [self.navigationController popToViewController:controller animated:YES];
    }
}