บทช่วยสอน WPF สำหรับผู้เริ่มต้น: วิธีสร้างแอปพลิเคชัน [ตัวอย่าง]

WPF ถือเป็นวิวัฒนาการจาก WinForms โดยช่วยให้ระบบแสดงผลกราฟิกใช้งานง่าย Windows- ให้การแยกระหว่าง UI และตรรกะทางธุรกิจได้ง่าย

แอปพลิเคชัน WPF สามารถนำไปปรับใช้ในระบบของคุณเป็นโปรแกรมเดสก์ท็อปแบบสแตนด์อโลน หรือโฮสต์เป็นอ็อบเจ็กต์ฝังตัวในเว็บไซต์ได้

ทำไมต้อง WPF?

มีเหตุผลหลายประการในการใช้แพลตฟอร์ม WPF เหตุผลหลักบางประการคือ-

• แพลตฟอร์มที่เหมาะสำหรับการใช้งานหากคุณต้องการจัดการกับสื่อประเภทต่างๆ
• WPF อนุญาตให้คุณสร้างส่วนต่อประสานผู้ใช้แบบสกิน นอกจากนี้ยังช่วยคุณเมื่อคุณต้องการโหลดส่วนของ UI หรือต้องการผูกข้อมูล XML
• ช่วยให้คุณสามารถใช้ประโยชน์จากไลบรารีคลาส .NET ขนาดใหญ่ตามที่ถูกสร้างขึ้น เทคโนโลยี.เน็ต
• ความเป็นอิสระของความละเอียด ดังนั้นแอปพลิเคชันที่พัฒนาโดยใช้ WMF จึงสามารถทำงานบนอุปกรณ์เคลื่อนที่หรือจอภาพขนาด 20 นิ้วได้
• WPF สร้างบน DirectX แทน WinAPI มีระบบกราฟิกของคอมพิวเตอร์ไคลเอนต์ ดังนั้นจึงให้พลังการเรนเดอร์กราฟิกที่มากขึ้น
• รองรับโมเดลเอกสารโฟลว์ซึ่งช่วยให้สามารถ "เผยแพร่เดสก์ท็อป" ของเลย์เอาต์ได้
• หน้าตาและกิริยาสัมพันธ์กันอย่างหลวมๆ สิ่งนี้ทำให้นักออกแบบและนักพัฒนาสามารถทำงานกับสองโมเดลที่แยกจากกัน
• ในกรอบงาน WMF คุณสามารถออกแบบเครื่องมือแบบกราฟิกบนเอกสาร XML แบบธรรมดาแทนการแยกวิเคราะห์โค้ดได้
• ช่วยให้คุณสามารถใช้การเร่งความเร็วด้วยฮาร์ดแวร์ในการวาด GUI เพื่อประสิทธิภาพที่ดีขึ้น

ประวัติความเป็นมาของ WPF

Windows 1.0 เป็นสภาพแวดล้อม GUI แรกจาก Microsoft- มันทำงานเป็นเลเยอร์บน DOS โดยอาศัยระบบ GDI และ USER สำหรับกราฟิกและอินเทอร์เฟซผู้ใช้

DirectX เปิดตัวในปี 1995 ในฐานะระบบกราฟิกประสิทธิภาพสูง มุ่งเป้าไปที่เกมและสภาพแวดล้อมที่เกี่ยวข้องกับกราฟิกอื่นๆ ในช่วงหลายปีที่ผ่านมา มีหลายเวอร์ชันที่ออกมาพร้อมกับ Directx9 ซึ่งมีไลบรารี่สำหรับใช้กับโค้ด mange.Net

เวอร์ชัน WPF	ปีที่วางจำหน่าย	เวอร์ชัน .Net	เวอร์ชัน Visual Studio	คุณสมบัติ
3.0	2006	3.0	N / A	การเปิดตัวครั้งแรก อย่างไรก็ตาม การพัฒนา WPF สามารถทำได้ด้วย VS 2005
3.5	2007	3.5	วีเอส 2008	การปรับเปลี่ยนและปรับปรุงใน: แบบจำลองแอปพลิเคชัน การเชื่อมโยง การควบคุม เอกสาร คำอธิบายประกอบ และองค์ประกอบ 3-D Ul
SP3.5 1	2008	SP3.5 1	N / A	รองรับหน้าจอเริ่มต้น การควบคุมเว็บเบราว์เซอร์ใหม่ รองรับ DirectX pixel shader
4.0	2010	4.0	วีเอส 2010	การควบคุมใหม่: ปฏิทิน DataGrid, DatePicker มัลติทัชและการจัดการ
4.5	2012	4.5	วีเอส 2012	เวลาการตั้งค่าเร็วขึ้นและประสิทธิภาพที่ดีขึ้นสำหรับเอฟเฟกต์บิตแมป การควบคุมใหม่: ปฏิทิน DataGrid, DatePicker มัลติทัชและการจัดการ
4.5.1	2013	4.5.1	วีเอส 2013	การควบคุมริบบิ้นใหม่ อินเทอร์เฟซ INotifyDataErrorlnfo ใหม่
4.5.2	2014	4.5.2	NA	ไม่มีการเปลี่ยนแปลงครั้งสำคัญ ไม่มีการเปลี่ยนแปลงครั้งสำคัญ
4.6	2015	4.6	วีเอส 2015	รองรับหน้าต่างลูกแบบโปร่งใส การปรับปรุง HDPI และ Touch

WPF 5.0.6 เวอร์ชันเสถียรล่าสุดซึ่งเปิดตัวในเดือนเมษายน 2021

คุณสมบัติของ WPF

• เอกสารและการพิมพ์
• ความปลอดภัย การเข้าถึง และการแปลเป็นภาษาท้องถิ่น
• เสนอความสามารถในการทำงานร่วมกันกับ Windows การควบคุมแบบฟอร์ม
• Direct3D ใช้ในแอปพลิเคชันกราฟิกที่ประสิทธิภาพเป็นสิ่งสำคัญ
• ใช้ฮาร์ดแวร์การ์ดแสดงผลสำหรับการเรนเดอร์
• กราฟิกแบบเวกเตอร์ช่วยให้คุณสามารถปรับขนาดแอปพลิเคชันของคุณได้โดยไม่สูญเสียคุณภาพ
• WPF รองรับระบบโลจิคัลพิกเซลทศนิยมและสี ARGB 32 บิต
• กำหนดสไตล์และเทมเพลตการควบคุมใหม่
• การสร้างแบบอักษรสากลจากแบบอักษรผสม
• การแสดงข้อความ WPF ช่วยให้คุณใช้ประโยชน์จากเทคโนโลยี ClearType
• ช่วยให้คุณใช้เทคนิคการแคชข้อความที่แสดงผลล่วงหน้าในหน่วยความจำวิดีโอ
• แนวทางที่อิงทรัพยากรสำหรับทุกการควบคุม
• ตัวจับเวลาการนำเสนอเริ่มต้นและจัดการโดย WPF
• รองรับความสัมพันธ์ระหว่างวิดีโอและภาพเคลื่อนไหวด้วย
• ใน WPF สไตล์คือชุดของคุณสมบัติที่ควรนำไปใช้กับเนื้อหาที่ใช้สำหรับการแสดงผลภาพ
• เทมเพลตใน WPF ช่วยให้คุณเปลี่ยน Ul ของเอกสารของคุณได้
• คำสั่งนั้นเป็นเหตุการณ์ที่เป็นนามธรรมและเชื่อมโยงอย่างหลวมๆ มากกว่า
• การรองรับคำสั่ง WPF จะช่วยลดจำนวนโค้ดที่เราต้องเขียน

ต่อไปใน WPF นี้ บทช่วยสอน C #เราจะเรียนรู้เกี่ยวกับประเภทแกน WPF และโครงสร้างพื้นฐาน

ประเภทแกน WPF และโครงสร้างพื้นฐาน

คลาสใน WPF แบ่งออกเป็นสี่ประเภท:

• UIองค์ประกอบ
• กรอบองค์ประกอบ
• เนื้อหาองค์ประกอบ
• กรอบเนื้อหาองค์ประกอบ

คลาสเหล่านี้เรียกว่าคลาสองค์ประกอบพื้นฐาน ซึ่งช่วยสร้างรากฐานให้กับโมเดลของการสร้างอินเทอร์เฟซผู้ใช้

ส่วนติดต่อผู้ใช้ WPF ประกอบด้วยองค์ประกอบที่ประกอบกันเป็นลำดับชั้นแบบต้นไม้ เรียกว่า ต้นไม้ธาตุ. แผนผังองค์ประกอบเป็นวิธีที่ใช้งานง่ายในการจัดวางส่วนติดต่อผู้ใช้ เป็นโครงสร้างที่ช่วยให้คุณได้รับคุณลักษณะของบริการ UI ที่มีประสิทธิภาพ

xaml

ภาษามาร์กอัปแอปพลิเคชันแบบขยายได้ซึ่งเรียกว่า "XAML" หรือ "zammel" เป็นวิธีที่เปิดเผยในการกำหนดส่วนต่อประสานกับผู้ใช้

นี่คือคำจำกัดความ XAML ของปุ่มธรรมดา:

<Button
FontSize="16"
HorizontalAlignment="Center"
VerticalAlignment="Center"
>
Say Hello Guru99</Button>

ข้อดีของการใช้ภาษา XAML:

• XAML แยกลักษณะส่วนหน้าออกจากตรรกะส่วนหลัง
• XAML เป็นวิธีที่ง่ายที่สุดในการแสดงส่วนต่อประสานกับผู้ใช้
• XAML ทำงานได้อย่างมีประสิทธิภาพด้วยเครื่องมือ

ควบคุม

กรอบงาน WPF รองรับการควบคุมที่มีประโยชน์มากมาย เช่น:

• การควบคุมการแก้ไข เช่น ข้อความBox, ตรวจสอบBox, เรดิโอบัตตัน
• การควบคุมรายการ เช่น รายการBox, ลิสต์วิว, ทรีวิว
• ข้อมูลผู้ใช้ เช่น Label, WPF ProgressBar, ToolTip
• การดำเนินการ เช่น เมนู ปุ่ม และแถบเครื่องมือ
• ลักษณะที่ปรากฏเช่น Border, WPF Image และ Viewbox
• กล่องโต้ตอบทั่วไปเช่น OpenFileDialog และ PrintDialog
• คอนเทนเนอร์เช่น TabContro, ScrollBar และ GroupBox
• เค้าโครงเช่น DocPanel, StackPanel และ Grid
• การนำทาง เช่น Frame และ Hyperlink

รูปลักษณ์ของส่วนควบคุมสามารถปรับแต่งตามสไตล์และเทมเพลตได้โดยไม่ต้องเขียนโปรแกรม คุณยังสามารถสร้างการควบคุมแบบกำหนดเองได้โดยการสืบทอดคลาสใหม่จากคลาสพื้นฐานที่เหมาะสม

ลักษณะ

WPF มีคุณสมบัติสำหรับปรับแต่งรูปลักษณ์ของแอปพลิเคชันของคุณ ช่วยให้คุณสามารถตั้งค่าวัตถุและค่าต่างๆ เช่น แบบอักษร พื้นหลัง ฯลฯ

คุณลักษณะสไตล์ช่วยให้คุณกำหนดรูปลักษณ์เฉพาะของผลิตภัณฑ์ทั้งหมดให้เป็นมาตรฐานได้ ช่วยให้คุณสามารถแทนที่ลักษณะที่ปรากฏเริ่มต้นในขณะที่ยังคงลักษณะการทำงานเริ่มต้นไว้ได้

เทมเพลตข้อมูลช่วยให้คุณควบคุมการแสดงภาพเริ่มต้นของข้อมูลที่ผูกไว้ได้ ด้วยความช่วยเหลือของธีม คุณสามารถสร้างภาพสไตล์จากระบบปฏิบัติการได้อย่างง่ายดาย

เค้าโครงและแผง

เค้าโครงช่วยคุณในการควบคุมตำแหน่งและขนาดที่เหมาะสม เป็นส่วนหนึ่งของกระบวนการเขียนงานนำเสนอให้กับผู้ใช้ กรอบงาน WPF ช่วยให้กระบวนการจัดวางง่ายขึ้น และนำเสนอความสามารถในการปรับเปลี่ยนรูปลักษณ์ UI ได้ดียิ่งขึ้น

โครงสร้างพื้นฐานเค้าโครงที่นำเสนอโดยคลาสต่างๆ ได้แก่ 1) StackPanel 2) DockPanel 3) WrapPanel 4) Grid และ 5) Canvas

กราฟิก

WPF มีระบบกราฟิกที่ได้รับการปรับปรุงเช่น

• WPF ใช้หน่วยที่ไม่ขึ้นอยู่กับอุปกรณ์ ช่วยให้สามารถแก้ปัญหาและความเป็นอิสระของอุปกรณ์ได้ ดังนั้นแต่ละพิกเซลซึ่งไม่ขึ้นอยู่กับอุปกรณ์ จึงปรับขนาดโดยอัตโนมัติด้วยระบบการตั้งค่าจุดต่อนิ้ว
• WPF ใช้ double แทน float และรองรับสีที่หลากหลายยิ่งขึ้น
• เอ็นจิ้นกราฟิก WPF ได้รับการออกแบบในลักษณะที่สามารถใช้ประโยชน์จากฮาร์ดแวร์กราฟิกได้เมื่อพร้อมใช้งาน

เอกสารและการพิมพ์

กรอบงาน WPF มีเอกสารสามประเภท:

• เอกสารคงที่: เอกสารประเภทนี้รองรับ WYSIWวายจีนำเสนอ
• เอกสารการไหล: ช่วยให้คุณปรับและจัดเรียงเนื้อหาใหม่ตามตัวแปรรันไทม์ เช่น ขนาดหน้าต่างและความละเอียดของอุปกรณ์
• เอกสาร XPS: เป็นการนำเสนอเอกสารอิเล็กทรอนิกส์ในรูปแบบ XML แบบแบ่งหน้า XPS เป็นรูปแบบเอกสารโอเพ่นซอร์สและข้ามแพลตฟอร์ม

WPF ช่วยให้สามารถควบคุมระบบการพิมพ์ได้ดีขึ้น รวมถึงการพิมพ์และคิวจากระยะไกล นอกจากนี้ เอกสาร XPS ยังสามารถพิมพ์ได้โดยตรงโดยไม่ต้องแปลงเป็นรูปแบบการพิมพ์

WPF Archiเทคเจอร์

WPF เป็นส่วนหนึ่งของกรอบงาน .NET ซึ่งประกอบด้วยโค้ดทั้งแบบที่ได้รับการจัดการและไม่ได้รับการจัดการ ส่วนประกอบสำคัญของสถาปัตยกรรม WPF จะอธิบายไว้ในรูปด้านล่าง:

ส่วนประกอบของสถาปัตยกรรม WPF

• กรอบการนำเสนอ:ช่วยให้คุณสร้างองค์ประกอบระดับบนสุด เช่น การควบคุม สไตล์ เค้าโครง หน้าต่าง ฯลฯ
• PresentationCore: เก็บประเภทพื้นฐานเช่น UIElement, Visual จากส่วนควบคุมทั้งหมดและรูปร่างที่ได้รับมาใน PresentationFramework.dll
• CLR: มันทำให้กระบวนการพัฒนามีประสิทธิผลโดยนำเสนอคุณสมบัติเช่น การจัดการหน่วยความจำ, การจัดการข้อผิดพลาด ฯลฯ
• มิลคอร์: Milcore เป็นส่วนหนึ่งของโค้ดที่ไม่มีการจัดการซึ่งมีการบูรณาการอย่างแน่นหนากับ DirectX
• DirectX: เป็น API ระดับต่ำที่ช่วยให้สามารถเรนเดอร์กราฟิกของ WPF ได้ การพูดคุยของ DirectX จะโต้ตอบกับไดรเวอร์และเรนเดอร์เนื้อหา
• ผู้ใช้32: เป็น core API ที่หลายๆ โปรแกรมใช้กันอย่างแพร่หลาย มันจัดการหน่วยความจำและการแยกกระบวนการ User32 ช่วยให้คุณตัดสินใจว่าองค์ประกอบใดจะถูกวางไว้ที่ตำแหน่งบนหน้าจอ
• เคอร์เนล: อินพุตมีต้นกำเนิดเป็นสัญญาณบนไดรเวอร์อุปกรณ์โหมดเคอร์เนล และถูกกำหนดเส้นทางไปยังกระบวนการที่ถูกต้องและโดยการเชื่อมต่อด้วย Windows เคอร์เนลและ User32

การติดตั้ง WPF

อ้างถึงลิงค์นี้เพื่อติดตั้ง WPF https://www.guru99.com/download-install-visual-studio.html

ต่อไปในบทช่วยสอนแอปพลิเคชัน WPF นี้ เราจะสร้าง WPF แรกของเรา

จะสร้างแอปพลิเคชัน WPF แรกของคุณได้อย่างไร

ในตัวอย่าง WPF นี้ เราจะพัฒนาแอปพลิเคชัน WPF ขั้นพื้นฐาน ดังนั้น มาเริ่มการใช้งานแบบง่ายๆ โดยทำตามขั้นตอนในตัวอย่างแอปพลิเคชัน WPF ด้านล่าง

ขั้นตอน 1) ใน Visual Studio ไปที่ไฟล์ > โปรเจ็กต์

ขั้นตอน 2) ในหน้าต่างโครงการใหม่

1. เลือกแอป WPF
2. ป้อนชื่อเป็น “MyWPF”
3. คลิกตกลง

ขั้นตอน 3) Visual Studio สร้างไฟล์สองไฟล์ตามค่าเริ่มต้น

• ไฟล์ XAML (MainWindow.xaml)
• ไฟล์ CS (MainWindow.xaml.cs)

MainWindow.xaml มี

1. หน้าต่างการออกแบบ
2. ไฟล์ XAML

ในหน้าต่าง XAML แท็กต่อไปนี้จะถูกเขียนเป็นค่าเริ่มต้น

ตารางเป็นองค์ประกอบแรกตามค่าเริ่มต้น

MainWindow.xaml.cs มีโค้ดที่เกี่ยวข้องอยู่ด้านหลังไฟล์ออกแบบ XAML

ขั้นตอน 4) ในกล่องเครื่องมือ

1. ลากข้อความBox องค์ประกอบให้กับหน้าต่างการออกแบบ
2. ข้อความBox จะปรากฏในหน้าต่างการออกแบบ
3. คุณจะเห็นรหัส XAML สำหรับข้อความBox ที่เพิ่ม

ขั้นตอน 5) เปลี่ยนข้อความเป็น “โปรแกรม WPF แรก”

ขั้นตอน 6) คลิกปุ่มเริ่ม

ขั้นตอน 7) คุณจะเห็นหน้าต่างที่เอาต์พุต

ยินดีด้วย! คุณได้ออกแบบและสร้างแอปพลิเคชัน WPF แรกของคุณ ต่อไปในบทช่วยสอน WPF สำหรับผู้เริ่มต้น เราจะเห็นความแตกต่างระหว่าง WPF และ WinForms

WPF กับ WinForms

WPF	วินฟอร์ม
เป็นเฟรมเวิร์กที่ใหม่กว่า ดังนั้นจึงสอดคล้องกับมาตรฐานปัจจุบันมากขึ้น	มันเก่ากว่าดังนั้นจึงมีการทดลองและทดสอบมากกว่า
มันมีความยืดหยุ่นและมีคุณสมบัติมากมาย คุณสามารถออกแบบแอปพลิเคชันที่หลากหลายได้โดยไม่ต้องเขียนโค้ดหรือควบคุมการซื้อ	ไม่ได้มีคุณลักษณะมากมายนัก
นักพัฒนา 3rd การควบคุมปาร์ตี้มุ่งเน้นไปที่ความเข้ากันได้กับ WPF เนื่องจากเป็นอนาคต	มีการควบคุมของบุคคลที่สามมากมายที่คุณสามารถซื้อหรือรับได้ฟรี
XAML ช่วยให้คุณสร้างและแก้ไข GUI ของคุณได้อย่างง่ายดาย ช่วยให้สามารถแบ่งงานระหว่างนักออกแบบ (XAML) และโปรแกรมเมอร์ (C#, ASP.net ฯลฯ)	In Windows สร้างโค้ดทั้งหมดที่เขียนไว้ในที่เดียว
WPF สามารถสร้างส่วนต่อประสานผู้ใช้สำหรับทั้งคู่ Windows แอปพลิเคชันและเว็บแอปพลิเคชัน เช่น Silverlight และ XBAP	ไม่มีการสนับสนุนดังกล่าว
ชุดควบคุมในกล่องของ WPF มีข้อจำกัด	การควบคุมภายในกล่องมีประสิทธิภาพมาก

ประเภทของแอปพลิเคชันที่สร้างด้วย WPF

• WPF พยายามที่จะแทนที่แบบฟอร์มเว็บและแบบฟอร์มหน้าต่าง – สามารถสร้างแอปเพื่อทำงานในเบราว์เซอร์หรือหน้าต่างแบบสแตนด์อโลนได้
• Windows แบบฟอร์มและหน้า WPF สามารถอยู่ร่วมกันในแอปพลิเคชันเดียวกันได้
• คุณสามารถพัฒนาแอปพลิเคชันเพจ/หน้าต่างได้

คู่มือแนะนำ

• WPF แบบเต็มคือ Windows การเสนอ Foundation
• เป็นแพลตฟอร์มที่เหมาะสำหรับการใช้งานหากคุณต้องการจัดการกับสื่อประเภทต่างๆ
• Windows 1.0 เป็นสภาพแวดล้อม GUI แรกจาก Microsoft ซึ่งทำงานบน DOS และอาศัยระบบ GDI และ USER
• WPF ใน .NET นำเสนอความสามารถในการทำงานร่วมกันกับ Windows การควบคุมแบบฟอร์ม
• WPF แบ่งออกเป็นสี่ประเภทที่แตกต่างกัน เช่น UIElement, FrameworkElement ContentElement และ FrameworkContentElement
• ส่วนประกอบที่สำคัญที่สุดของสถาปัตยกรรม WPF ได้แก่ PresentationFramework, PresentationCore, CLR, Milcore, DirectX, User32 และ Kernel
• WPF เป็นกรอบงานใหม่ที่เปรียบเทียบกับ WinForms จึงสอดคล้องกับมาตรฐานปัจจุบันมากกว่า
• Windows แบบฟอร์มและหน้า WPF สามารถอยู่ร่วมกันในแอปพลิเคชันเดียวกันได้