qrbtf/README.md

104 lines
2.2 KiB
Markdown
Raw Normal View History

2020-06-15 05:57:40 +00:00
<h1 align="center"><img alt="QRBTF" src=".github/qrbtf-logo.svg" height="75"></h1>
2020-06-15 05:54:23 +00:00
2020-06-11 12:25:44 +00:00
<p align="center">
2020-06-11 12:27:08 +00:00
URL: <a href="https://qrbtf.com" rel="noopener noreferrer" target="_blank">qrbtf.com</a><br />
2020-06-11 12:25:44 +00:00
QRBTF is a simple web app to beautify your QR code.
</p>
<p align="center">
2020-06-22 11:00:23 +00:00
<img src="public/img/QRcodes.jpg">
2020-06-11 12:25:44 +00:00
</p>
## Features
2020-06-11 12:15:36 +00:00
2020-06-24 03:15:32 +00:00
* Various Art QR Code Styles
2020-06-11 12:15:36 +00:00
* Parametric Design
* No Backend Required
* Support for SVG Downloads
2020-05-22 15:40:26 +00:00
2020-06-11 12:25:44 +00:00
中文介绍:
2020-05-22 15:40:26 +00:00
2020-06-11 12:25:44 +00:00
* [如何制作一个漂亮的二维码](https://mp.weixin.qq.com/s/_Oy9I9FqPXhfwN9IUhf6_g)
* [QRBTF 开源啦!来写个二维码样式吧~](https://mp.weixin.qq.com/s/GFEMCWQu3e2qhTuBabnHmQ)
2020-06-11 12:15:36 +00:00
## QRBTF Website
### Installation
2020-05-22 15:40:26 +00:00
``` bash
2020-05-23 11:18:00 +00:00
git clone https://github.com/ciaochaos/qrbtf.git
cd qrbtf
2020-05-22 15:40:26 +00:00
npm install
npm start
```
2020-06-11 12:15:36 +00:00
### Usage
2020-05-22 15:40:26 +00:00
1. Open [qrbtf.com](https://qrbtf.com).
2. Enter a URL or text.
3. Select a style.
4. Adjust parameters.
5. Download `JPG` or `SVG`.
2020-06-11 12:15:36 +00:00
## React Component (react-qrbtf)
2020-05-22 15:40:26 +00:00
2020-06-25 12:06:06 +00:00
See [CPunisher / react-qrbtf](https://github.com/cpunisher/react-qrbtf) for more information.
2020-06-11 12:15:36 +00:00
``` bash
npm install react-qrbtf --save
```
### Include the Component
```js
import React from 'react'
import { QRNormal } from 'react-qrbtf'
class Component extends React.Component {
2020-06-24 03:15:32 +00:00
2020-06-11 12:15:36 +00:00
render() {
2020-06-24 03:15:32 +00:00
return (
<QRNormal
value="react-qrbtf"
className="my-qrcode"
styles={{ svg: {width: "200px"} }}
type="round"
size={50}
opacity={80}
posType="planet"
otherColor="#33CCCC"
posColor="#009999"
/>
)
2020-06-11 12:15:36 +00:00
}
}
```
## Third-Party Project
* [gexin1 / beautify-qrcode](https://github.com/gexin1/beautify-qrcode)
2020-06-23 08:25:06 +00:00
## Author
* [ciaochaos](https://github.com/ciaochaos)
* [CPunisher](https://github.com/CPunisher)
2020-05-22 16:50:40 +00:00
## Donation
#### Paypal
[![](https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif)](https://www.paypal.me/ciaochaos)
#### Alipay
2020-06-22 11:06:38 +00:00
<img align="center" src="https://blog.ciaochaos.com/projects/qrcode/alipay2.jpeg" width="250">
2020-06-13 07:08:41 +00:00
## Dependency
2020-06-22 11:06:38 +00:00
* [davidshimjs / qrcode](https://github.com/davidshimjs/qrcodejs)
* [cozmo / jsQR](https://github.com/cozmo/jsQR)
2020-06-15 05:54:23 +00:00
## LICENSE
2020-06-15 05:57:40 +00:00
[GPLv3](LICENSE)