[Param checkbox]

src/components/param/ParamCheckbox.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import PropTypes from 'prop-types'
+import '../Qrcode.css';
+
+const ParamCheckBox = ({ rendererIndex, paramIndex, value, onChange }) => (
+    <input
+        type="checkbox"
+        className="Qr-checkbox"
+        key={"checkbox_" + rendererIndex + "_" + paramIndex}
+        checked={value}
+        onChange={onChange}>
+    </input>
+)
+
+ParamCheckBox.propTypes = {
+    rendererIndex: PropTypes.number.isRequired,
+    paramIndex: PropTypes.number.isRequired,
+    value: PropTypes.bool.isRequired,
+    onChange: PropTypes.func.isRequired
+}
+
+export default ParamCheckBox;

src/components/param/ParamList.js

@@ -5,11 +5,13 @@ import ParamTextViewer from "../../containers/param/ParamTextViewer";
 import ParamSelectViewer from "../../containers/param/ParamSelectViewer";
 import ParamColorViewer from "../../containers/param/ParamColorViewer";
 import ParamUploadViewer from "../../containers/param/ParamUploadViewer";
+import ParamCheckBoxViewer from "../../containers/param/ParamCheckBoxViewer";
 
 const mapTypeToComponent = ({
     [ParamTypes.TEXT_EDITOR]: ParamTextViewer,
     [ParamTypes.SELECTOR]: ParamSelectViewer,
     [ParamTypes.COLOR_EDITOR]: ParamColorViewer,
+    [ParamTypes.CHECK_BOX]: ParamCheckBoxViewer,
     [ParamTypes.UPLOAD_BUTTON]: ParamUploadViewer,
 })
 

src/constant/ParamTypes.js

@@ -2,6 +2,6 @@ export const ParamTypes = ({
     TEXT_EDITOR: 1,
     SELECTOR: 2,
     COLOR_EDITOR: 3,
-    MULTI_CHECK: 4,
+    CHECK_BOX: 4,
     UPLOAD_BUTTON: 5
 });

src/containers/param/ParamCheckBoxViewer.js

@@ -0,0 +1,17 @@
+import { connect } from 'react-redux';
+import {changeParam} from "../../actions";
+import ParamCheckBox from "../../components/param/ParamCheckbox";
+
+const mapStateToProps = (state, ownProps) => ({
+    rendererIndex: ownProps.rendererIndex,
+    paramIndex: ownProps.paramIndex,
+    value: state.paramValue[ownProps.rendererIndex][ownProps.paramIndex],
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+    onChange: (e) => {
+        dispatch(changeParam(ownProps.rendererIndex, ownProps.paramIndex, e.target.checked))
+    }
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(ParamCheckBox);

src/reducers/index.js

@@ -2,6 +2,7 @@ import {getQrcodeData} from "../utils/qrcodeHandler";
 import {actionTypes} from "../constant/ActionTypes";
 import {QRBTF_URL} from "../constant/References";
 import RendererBase from "../components/renderer/RendererBase";
+import {getExactValue} from "../utils/util";
 
 const initialState = {
     selectedIndex: 0,
@@ -53,12 +54,7 @@ export default function appReducer(state = initialState, action) {
                     }
 
                     const newItem = item.slice();
-                    let newValue = action.value;
-                    if (newValue.length <= 0)
-                        newValue = state.paramInfo[action.rendererIndex][action.paramIndex].default;
-
-                    if (!isNaN(newValue)) newValue = parseInt(newValue);
-                    newItem[action.paramIndex] = newValue;
+                    newItem[action.paramIndex] = getExactValue(action.value, state.paramInfo[action.rendererIndex][action.paramIndex].default);
                     return newItem;
                 })
             });

src/utils/util.js

@@ -51,6 +51,13 @@ export function gamma(r, g, b) {
     return Math.pow((Math.pow(r, 2.2) + Math.pow(1.5 * g, 2.2) + Math.pow(0.6 * b, 2.2)) / (1 + Math.pow(1.5, 2.2) + Math.pow(0.6, 2.2)), 1/2.2)
 }
 
+export function getExactValue(value, defaultValue) {
+    if (typeof value != "string") return value;
+    if (value.length <= 0) value = defaultValue;
+    if (!isNaN(value)) value = parseInt(value);
+    return value;
+}
+
 export function toBase64(file, width, height) {
     let canvas = document.createElement('canvas');
     let ctx = canvas.getContext('2d');