UE5 QRCode插件使用

本插件是我用源码重新封装的,不依赖静态库,纯源码,适用于多个UE版本,编辑器与打包发布都没有问题。本人在UE5EA上测试通过。

1.源码获取地址

GitHub - nayuki/QR-Code-generator: High-quality QR Code generator library in Java, TypeScript/JavaScript, Python, Rust, C++, C.

2.插件地址

UE4UE5QRCode源码版本-互联网文档类资源-CSDN下载

3.主要修改

为了打包后可用,修改了UQRCodeComponent类的GenerateQrCode方法:

UTexture2D* UQRCodeComponent::GenerateQrCode(UObject* parent, FString string)
{
	qrcodegen::QrCode qr = qrcodegen::QrCode::encodeText(TCHAR_TO_UTF8(*string), qrcodegen::QrCode::Ecc::LOW);

	uint8 size = qr.getSize();
	TArray<FColor> pixels;
	pixels.SetNumZeroed(size * size);

	FColor black = FColor::Black;
	FColor white = FColor::White;

	for (uint8 x = 0; x < size; x++)
	{
		for (uint8 y = 0; y < size; y++)
		{
			FColor color = qr.getModule(x, y) ? white : black;
			pixels[x + y * size] = color;
		}
	}

	UTexture2D* texture = UTexture2D::CreateTransient(size, size, EPixelFormat::PF_B8G8R8A8, "QRCode");
	void* data = texture->PlatformData->Mips[0].BulkData.Lock(1);
	FMemory::Memcpy(data, pixels.GetData(), size * size * 4);
	texture->PlatformData->Mips[0].BulkData.Unlock();
	texture->UpdateResource();

	texture->Filter = TextureFilter::TF_Nearest;

	return texture;
}

4.使用方法

1)创建一个actor蓝图类,为其添加QRCode组件

2)创建一个用于展示二维码的UI

 3)在关卡蓝图里编写蓝图代码

4)运行效果 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
要在uni-app中使用html5-qrcode,可以按照以下步骤进行操作: 1. 安装html5-qrcode库:在uni-app项目的根目录下打开终端,执行以下命令安装html5-qrcode库: ``` npm install html5-qrcode ``` 2. 在需要使用扫码功能的页面的Vue文件中引入html5-qrcode库: ```javascript import Html5Qrcode from 'html5-qrcode'; ``` 3. 在页面的data中定义一个变量用于存储扫码结果: ```javascript data() { return { qrCodeResult: '' } } ``` 4. 在页面的methods中编写扫码相关的方法: ```javascript methods: { startScan() { const qrCodeScanner = new Html5Qrcode('qr-code-reader'); qrCodeScanner.start((result) => { this.qrCodeResult = result; qrCodeScanner.stop(); }, (error) => { console.error('扫码失败:', error); }, { fps: 10, qrbox: 250 }); } } ``` 5. 在模板中添加一个容器元素,用于显示扫码区域,并绑定相关事件: ```html <template> <view> <view id="qr-code-reader"></view> <button @tap="startScan">开始扫码</button> <view>{{ qrCodeResult }}</view> </view> </template> ``` 在以上示例代码中,我们首先通过`import`语句引入了html5-qrcode库。然后,在`data`中定义了一个`qrCodeResult`变量,用于存储扫码结果。接下来,在`methods`中编写了`startScan`方法,该方法会创建一个Html5Qrcode实例,并通过调用`start`方法开始扫码。当扫码成功时,会将结果赋值给`qrCodeResult`变量,并停止扫码。如果扫码失败,则会在控制台输出错误信息。 在模板中,我们添加了一个容器元素`<view id="qr-code-reader"></view>`,用于显示扫码区域。点击按钮时,会调用`startScan`方法开始扫码。扫码结果会通过值表达式`{{ qrCodeResult }}`显示在页面上。 请注意,以上示例代码仅为演示如何在uni-app中使用html5-qrcode库开发扫码功能,实际使用时需要根据你的项目需求进行适当的调整。确保已正确安装和配置html5-qrcode库,并将其正确引入到uni-app项目中。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

东风吹柳

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值