2020年10月_最孤单的人

12月 11月 10月 09月 08月 07月 06月

原创学习React第七篇：将自定义propType验证添加到React组件

继编写使用Reacts props.children访问嵌套数据除了React.propTypes中内置的类型之外，我们还可以定义自己的自定义propType验证器在此示例中，我们的标题组件期望文本道具在使用时不会传递。我们为组件提供了一个PropTypes设置，它期望文本prop是字符串的PropType。可以在IsRequired上进行标记，以使我们的组件抛出未提供prop的错误，但这大约是我们可以实现的内置验证的程度。如果我们想进一步验证，我们可以返回一个自定义函数，而不是返回React..

2020-10-28 22:09:54 646

原创学习React第六篇：使用Reacts props.children访问嵌套数据

继编写将React组件用作其他组件的子组件在构建React组件时，您可能需要访问标记的子属性。 this.props.children访问innerHTML或另一个组件的嵌套组件。为了访问组件中的嵌套值或组件，可以使用props.children：示例文件 State.js：import React from 'react'class PropsChildren extends React.Component { render() { return ( .

2020-10-27 21:22:11 637

原创学习React第五篇：将React组件用作其他组件的子组件

继编写使用setState管理React组件状态owner-ownee的关系用于指定与React组件的父子关系，因为它不同于DOM关系。本篇演示了使用无状态函数显示数据时React的可组合性。React的重要特征是React组件可以输出或渲染其他React组件。这里有一个非常简单的组件。示例文件 State.js：import React from 'react'class State extends React.Component { //为了让我们开始使用状态，我将在这里.

2020-10-27 09:06:34 262

原创学习React第四篇：使用setState管理React组件状态

继编写在React组件上设置属性(PropTypes)与props不同，props是要作为静态值传递到我们的组件中的值的集合，而并非要被我们的组件更改。状态表示将要管理的值的集合，并由我们的组件更新。接下来，使用setState管理React组件状态：示例文件 State.jsimport React from 'react'class State extends React.Component { //为了让我们开始使用状态，我将在这里设置一个构造函数方法 con..

2020-10-26 17:21:23 232

原创 VS Code常用快捷键

常用快捷键：#1编辑器与窗口管理打开一个新的VS Code编辑器: Ctrl+Shift+N关闭当前窗口: Ctrl+W#2代码编辑代码行向左或向右缩进: Ctrl+[ 、 Ctrl+]复制或剪切当前行/当前选中内容: Ctrl+C 、 Ctrl+V代码格式化: Shift+Alt+F向上或向下移动一行: Alt+Up 或 Alt+Down向上或向下复制一行: Shift+Alt+Up 或 Shift+Alt+Down在当前...

2020-10-25 15:14:54 204

原创学习React第三篇：在React组件上设置属性(PropTypes)

继编写使用组件的render方法在React中显示输出接下来，在React组件上设置属性：import React from 'react';import PropTypes from 'prop-types';class App extends React.Component { render() { let txt = this.props.txt return <h1>{txt}</h1> }}App.propTypes =..

2020-10-24 14:04:53 1241

原创学习React第二篇：使用组件的render方法在React中显示输出

继编写第一个“ Hello World” React组件编写使用组件的render方法在React中显示输出：import React from 'react';class App extends React.Component { render() { return ( <div> <h1>Hello World</h1> <b>Bold</b> </div

2020-10-24 12:37:06 847

原创学习React第一篇：编写一个“ Hello World” React组件

在安装开发环境 / 创建应用 / 并在VS Code中查看你自己创建的应用程序后，开始编写第一个“ Hello World” React组件：import React from 'react';class App extends React.Component { render() { // return React.createElement('hi', null, "Hello World") return <h1>Hello World</h1&..

2020-10-24 12:16:48 285

原创【CustomView】数字解锁键盘（LockKeypad）-附带错误抖动动画实现

自定义数字解锁功能，如下所示：#### 自定义View；在验证错误的时候，会有错误提示，以及抖动动画出现transformationMethod设置应用于此TextView显示的文本的转换（转换成星号）：(这里的代码在自定义view里都有，我只是单独贴出来)input.transformationMethod = object : TransformationMethod { override fun onFocusChanged( ..

2020-10-19 17:16:16 346

原创【CustomView】数字解锁键盘（LockKeypad）- 用星号图标替换文案显示

自定义数字解锁功能，如下所示：#### 自定义View这里的密码显示星号（*）是设计师提供设计icon。当然，如果有不需要的可以把对应代码注掉就行；主要的星号（icon）替换代码：password_display.text = it.toDisplayByInput(context)// 循环替换每个数字fun Editable.toDisplayByInput(context: Context): CharSequence { val length = this.

2020-10-17 15:45:49 408

原创【CustomView】扫码中的扫描框（ViewfinderView）-简单实现

项目中有的扫码功能中需要覆盖一层扫码框，如下所示：#### 自定义View，绘制4个角且需要圆角1.CustomView >>>ViewfinderView/** * viewfinder window */class ViewfinderView @JvmOverloads constructor( context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = -1.

2020-10-16 22:01:38 1771

原创 Extension method - LocalDate

#### 对日期（LocalDate）做处理，写成扩展方法，即一行代码使用示例：1.判断两个日期是否在同一周：dateA.isSameWeek(dateB)扩展写法：fun LocalDate.isSameWeek(endExclusive: LocalDate = LocalDate.now()): Boolean { val weekStartTime = this.with(ChronoField.DAY_OF_WEEK, 1) // Monday val week

2020-10-15 22:24:23 262

原创 Extension method - clipOutlineCornerRadius

#### 对布局View 做圆角处理，写成扩展方法，即一行代码使用示例：view.clipOutlineCornerRadius()扩展写法：fun View.clipOutlineCornerRadius(radius : Float = 10F) { outlineProvider = object : ViewOutlineProvider() { override fun getOutline(view: View?, outline: Outline?) {

2020-10-15 21:57:07 111

原创 Extension method - setOnSingleClickListener

### 此类用于扩展功能setOnSingleClickListener，这样做的目的是防止重复响应点击/触摸。使用示例：view.setOnSingleClickListener { //TODO 这里将会执行你的点击事件 setUIData()}扩展写法：fun View.setOnSingleClickListener(listener: (View) -> Unit) { setOnClickListener(OnSingleClick.

2020-10-15 21:32:21 194

原创 Reactjs 初学入坑 - npm start报错

打开 VS code 运行 npm start :npm报错:This is probably not a problem with npm,there is likely additional logging output above可能由于种种版本更新的原因需要执行需要重新 npm install解决方法：输入npm install 或 npm i 后，等执行结束再运行npm start即可。*npm install执行会需要几分钟时间来重新加载所以的资源...

2020-10-15 20:41:20 387

原创 Kotlin.jvm - @JvmOverloads

@JvmOverloads:Instructs the Kotlin compiler to generate overloads for this function that substitute default parameter values.If a method has N parameters and M of which have default values, M overloads are generated: the first one takes N-1 parameters (

2020-10-15 14:22:53 441

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

最孤单的人的博客