Windows Store Apps and Generate QR Codes (C#) |
Windows Store Apps and Generate QR Codes (C#) สำหรับ QR Code ชื่อเต็ม ๆ ว่า Quick Response เป็นรหัส Code รูปแบบใหม่เป็นแบบ 2 มิติ มีลักษณะสี่เหลี่ยม ๆ ที่ได้รับความนิยมมากในปัจจุบัน เพราะคุณสมบัติที่ เป็นสัญลักษณ์แทนข้อมูลต่างๆ ที่มีการตอบสนองที่รวดเร็ว ซึ่งส่วนใหญ่จะนำมาใช้กับสินค้า, สื่อโฆษณาต่างๆ เพื่อให้ข้อมูลเพิ่มเติม หรือจะเป็น URL เว็บไซต์ ตามที่เราจะเห็นได้จากสื่อต่าง ๆ ไม่ว่าจะเป็นป้ายโฆษณา และสื่อทั่ว ๆ ไป
Windows Store Apps and QR Code
ในการสร้าง QR Code นั้นบน Windows Store Apps จะไม่มี Class ไว้สำหรับการเรียกใช้งานโดยตรง แต่เราจะอาศัย Library ที่มีชื่อว่า TCD.Device.Camera ซึ่งเป็น Package ที่สามารถติดตั้งผ่าน NuGet Package สามารถติดตั้งและใช้งานได้ฟรี ๆ อีกทั้งรูปแบบการใช้งานนั้นก็ง่ายมาก
ขั้นตอนการสร้าง QR Code บน Windows Store Apps

คลิกขวาที่ Add Reference เลือก Manage NuGet Package

ค้นหา Package ที่มีชื่อว่า TCD.Device.Camera ให้ Install ลงใน Project

Add เข้ามาใน Project
เรียกใช้ Class ของ TCD.Device.Camera.Barcodes
using TCD.Device.Camera.Barcodes;
Syntax การ Generate สามารถทำได้ง่าย ๆ
await Encoder.GenerateQRCodeAsync("String", 410);
Parameters แรกเป็นข้อความ ส่วนอันที่สอง เป็นความกว้างของรูป

Example ตัวอย่างการเขียน Windows Store Apps เพื่อ Generate ไฟล์ QR Code

ออกแบบหน้าจอประกอบด้วย TextBox, Image และ Button สำหรับปุ่ม Generate QR Code
MainPage.xaml
<Page
x:Class="WindowsStoreApps.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:WindowsStoreApps"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="String" FontSize="20" VerticalAlignment="Top" Margin="510,136,0,0"/>
<TextBox HorizontalAlignment="Left" TextWrapping="Wrap" x:Name="txtString" VerticalAlignment="Top" Margin="586,133,0,0" Width="412" FontFamily="Global User Interface"/>
<Button Content="Generate" x:Name="btnSend" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="584,185,0,0" Width="105" Click="btnGenerate_Click"/>
<Image x:Name="imgView" HorizontalAlignment="Left" Height="180" Margin="585,248,0,0" VerticalAlignment="Top" Width="410"/>
</Grid>
</Page>
MainPage.xam.cs
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Devices.Geolocation;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Core;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using TCD.Device.Camera.Barcodes;
// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238
namespace WindowsStoreApps
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
///
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private async void btnGenerate_Click(object sender, RoutedEventArgs e)
{
imgView.Source = await Encoder.GenerateQRCodeAsync(this.txtString.Text, 410);
}
}
}
Result

หน้าจอ Apps ที่ได้

ทดสอบการทำงาน โดยกรอก Text และแปลงเป็น QR Code โดยการคลิกที่ Generate

ได้ QR Code ที่ต้องการ

อันนี้ทดสอบการอ่าน QR Code โดยใช้ การอ่าน QR Code จาก Apps ที่อยู่บน iOS/iPhone
เพิ่มเติม ในกรณีที่ต้องการจัดเก็บลงใน Storage ของ Windows Store Apps ใช้เพิ่มคำสั่ง
Windows.Storage.StorageFolder localFolder = Windows.Storage.ApplicationData.Current.LocalFolder;
Windows.Storage.StorageFile sampleFile = await localFolder.CreateFileAsync("image.jpg",CreationCollisionOption.ReplaceExisting);
await Windows.Storage.FileIO.WriteBytesAsync(sampleFile, bitmapImage);
ซึ่งจะเป็นการเขียนไฟล์ลงใน Storage

.
|
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท
|
|
|
By : |
ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ) |
|
Score Rating : |
  |
|
|
Create/Update Date : |
2014-06-23 13:18:57 /
2017-03-19 15:01:18 |
|
Download : |
No files |
|
Sponsored Links / Related |
|
|
|
|
|
|
|