QR.Flutter是一個撲朔迷離的庫,可通過小部件或自定義畫家進行簡單而快速的QR碼渲染。
請不要提交“如何..?”的問題。或“怎麼辦..?”類型問題。他們幾乎會立即關閉。如果您有疑問,請在討論委員會或堆棧溢出中詢問他們。他們會在那裡得到回答。
使用問題會產生大量的噪音,並導致實際問題越來越慢。
版本兼容性:4.0.0+支持無效的安全性,並需要兼容的顫動版本。如果您使用的是不兼容的Flutter版本,請使用此庫的3.x版本。
您應該將以下內容添加到您的pubspec.yaml文件:
dependencies :
qr_flutter : ^4.1.0注意:如果您使用的是“顫音master頻道”,則遇到構建問題,或者想嘗試最新和最偉大的問題,則應使用master分支,而不是特定的版本版本。為此,請在pubspec.yaml中使用以下配置:
dependencies :
qr_flutter :
git :
url : https://github.com/theyakka/qr.flutter請記住, master分支可能不穩定。
將依賴關係添加到pubspec.yaml之後flutter packages get或更新軟件包。
首先,導入代碼中的依賴性:
import 'package:qr_flutter/qr_flutter.dart' ;接下來,要渲染基本的QR代碼,您可以使用以下代碼(或類似的代碼):
QrImageView (
data : '1234567890' ,
version : QrVersions .auto,
size : 200.0 ,
),根據您的數據要求,您可能需要調整QR碼輸出。可用以下選項:
| 財產 | 類型 | 描述 |
|---|---|---|
version | int | QrVersions.auto或1到40之間的值。有關限制和詳細信息,請參見http://www.qrcode.com/en/about/version.html。 |
errorCorrectionLevel | int | 在QrErrorCorrectLevel上定義的值。例如: QrErrorCorrectLevel.L 。 |
size | 雙倍的 | 圖像的(平方)大小。如果沒有給出,將使用最短尺寸約束自動大小。 |
padding | 邊緣組 | 圍繞QR碼數據的填充。 |
backgroundColor | 顏色 | 背景顏色(默認為無)。 |
eyeStyle | qreyestyle | 配置QR碼眼睛(角落)形狀和顏色。 |
dataModuleStyle | Qrdatamodulestyle | 配置點的形狀和顏色。 |
gapless | 布爾 | 添加一個額外的像素以防止空白(默認值為TAME)。 |
errorStateBuilder | QRERRORBUILDER | 允許您在發生QR碼的錯誤時顯示錯誤狀態Widget (例如:版本太低,輸入太長等)。 |
constrainErrorBounds | 布爾 | 如果為true,則錯誤的Widget將被限制在QR碼將要插入的平方。如果是錯誤的,則錯誤狀態Widget將增長/縮小到所需的任何尺寸。 |
embeddedImage | ImageProvider | 定義要在QR碼中心覆蓋的映像ImageProvider 。 |
embeddedImageStyle | QREMBEDDEDIMAGESTYLE | 為嵌入式圖像設計的屬性。 |
embeddedImageEmitsError | 布爾 | 如果是thue,則任何未能加載嵌入式圖像的人都會觸發errorStateBuilder構建器或渲染空Container 。如果為false,則將渲染QR碼,並且嵌入式圖像將被忽略。 |
semanticsLabel | 細繩 | 屏幕讀取器將使用semanticsLabel來描述QR代碼的內容。 |
borderRadius | 雙倍的 | 形狀類型QrEyeShape.square , QrDataModuleShape.square , EmbeddedImageShape.square的設置轉彎。設置適當的樣式。 |
roundedOutsideCorners | 布爾 | 如果是真的,則數據的外角是圓形的。設置為QrDataModuleStyle 。默認情況下到達borderRadius 。只有QrDataModuleShape.square 。 |
outsideBorderRadius | 雙倍的 | 如果外部圓形outsideBorderRadius繪製與內部的borderRadius不同,則設置。不過是borderRadius 。只有QrDataModuleShape.square |
gradient | 坡度 | 將代碼的純色更改為梯度,例如LinearGradient 。 |
safeArea | 布爾 | 如果是正確的,則數據隱藏在embeddedImage後面。設置為QrEmbeddedImageStyle 。 |
safeAreaMultiplier | 雙倍的 | 乘數safeArea尺寸。 |
/example目錄中有一個簡單的,有效的示例幻影應用程序。您可以使用它來使用所有選項。
另外,以下示例為您提供了有關如何使用庫的快速概述。
基本的QR碼看起來像:
QrImageView (
data : 'This is a simple QR code' ,
version : QrVersions .auto,
size : 320 ,
gapless : false ,
)帶有圖像的QR碼(來自您應用程序的資產)看起來像:
QrImageView (
data : 'This QR code has an embedded image as well' ,
version : QrVersions .auto,
size : 320 ,
gapless : false ,
embeddedImage : AssetImage ( 'assets/images/my_embedded_image.png' ),
embeddedImageStyle : QrEmbeddedImageStyle (
size : Size ( 80 , 80 ),
),
)在無法驗證QR碼的情況下顯示錯誤狀態:
QrImageView (
data : 'This QR code will show the error state instead' ,
version : 1 ,
size : 320 ,
gapless : false ,
errorStateBuilder : (cxt, err) {
return Container (
child : Center (
child : Text (
'Uh oh! Something went wrong...' ,
textAlign : TextAlign .center,
),
),
);
},
)QR碼,內部和外部的圓角圓形和嵌入式圖像的安全區域:
QrImageView (
data : 'London is the capital of Great Britain' ,
version : QrVersions .auto,
size : 320 ,
eyeStyle : const QrEyeStyle (
borderRadius : 10 ,
),
dataModuleStyle : const QrDataModuleStyle (
borderRadius : 5 ,
roundedOutsideCorners : true ,
),
embeddedImage : AssetImage ( 'assets/images/my_embedded_image.png' ),
embeddedImageStyle : QrEmbeddedImageStyle (
size : Size . square ( 40 ),
color : Colors .white,
safeArea : true ,
safeAreaMultiplier : 1.1 ,
embeddedImageShape : EmbeddedImageShape .square,
borderRadius : 10 ,
),
)帶有梯度的QR碼:
QrImageView (
data : 'Rainbow after the rain' ,
version : QrVersions .auto,
size : 320 ,
gradient : LinearGradient (
begin : Alignment .bottomLeft,
end : Alignment .topRight,
colors : [
Color ( 0xffff0000 ),
Color ( 0xffffa500 ),
Color ( 0xffffff00 ),
Color ( 0xff008000 ),
Color ( 0xff0000ff ),
Color ( 0xff4b0082 ),
Color ( 0xffee82ee ),
],
),
)感謝凱文·摩爾(Kevin Moore)的出色QR-飛鏢圖書館。這是這個庫的核心。
有關作者/撰稿人信息,請參見AUTHORS文件。
QR.Flutter根據BSD-3許可發布。有關詳細信息,請參見LICENSE 。