เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 1
การสร้างชุดติดตั้งแบบ Setup Project
การสร้างชุดติดตั้งแบบ Setup Project เป็นการเพิ่มโปรเจ็กต์อีกหนึ่งตัวเข้าไปใน Solution ของแอพพลิเคชันที่พัฒนา
Windows Installer เป็นตัวช่วยในการติดตั้งแอพพลิเคชัน ซึ่งมีจุดเด่นดังนี้
- Rollback ถ้าการติดตั้งมีข้อผิดพลาด สามารถย้อนกลับไปที่เกิดข้อผิดพลาดนั้นได้โดยไม่ต้องเริ่มใหม่ทั้งหมด
- Self Repair เมื่อแอพพลิเคชันที่ติดตั้งทางานผิดพลาด ซ่อมแซมด้วยตัวแอพพลิเคชันเองได้
- Uninstall ทาการถอนการติดตั้งได้ทั้งหมด ลบทุกไฟล์ ไม่เหลือไฟล์ขยะ หรือรีจิสทรีขยะ
- Advertisement แทรกโฆษณา หรือข้อมูลที่ช่วยให้ผู้ใช้งานมั่นใจ และเข้าใจแอพพลิเคชันนั้น ๆ ได้
ไฟล์ที่ใช้ในการติดตั้งแบบ Setup Project
- ไฟล์โปรเจ็กต์ที่ทดสอบแล้ว
- ไฟล์ Readme.rtf เป็นไฟล์คาแนะนาเกี่ยวกับแอพพลิเคชัน
- ไฟล์ License.txt เป็นไฟล์ข้อมูลเกี่ยวกับลิขสิทธิ์
- ไฟล์ logo.bmp เป็นไฟล์ภาพโลโก้ในชุดติดตั้ง (ควรมีขนาด 700 X 50)
วิธีสร้างชุดติดตั้ง
1. เปิดโปรเจ็กต์ที่ทดสอบแล้ว
และเข้าสู่หน้าต่าง Project > Properties…
2. เลือก Application และคลิกเลือก Assembly Information…
3. เมื่อปรากฏหน้าต่าง Assembly Information
แก้ไขรายละเอียดของโปรแกรม ได้แก่ Title คือ ชื่อโปรแกรม
Description คือ รายละเอียด เช่น ติดตั้งโปรแกรมแปลงหน่วยสกุลเงิน
Company คือ บริษัท/ผู้เขียนโปรแกรม เช่น นักเรียนชั้น ม.5@บบว.
Product คือ เกี่ยวกับโปรแกรม เช่น โปรแกรมแปลงหน่วยสกุลเงิน
Copyright คือ ลิขสิทธิ์ เช่น Copyright © 2017 เป็นต้น
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 2
4. เลือกเมนู Build > Build tic tac toe
5. เลือกเมนู File > Add > New Project…
6. เมื่อปรากฏหน้าต่าง Add New Project เลือก Installed Templates
6.1 เลือก
Other Project Types >
Setup and Deployment >
Visual Studio Installer
6.2 คลิกเลือก
Setup Project
6.3 ตั้งชื่อ Setup1
6.4 คลิก OK
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 3
7. จะปรากฏหน้าต่าง File System ของไฟล์ Setup1
8. คลิกขวาที่ Setup1 และเลือกคาสั่ง Properties
9. ปรากฏหน้าต่าง Setup1 Property Pages
Output file name คือ ชื่อของไฟล์ติดตั้ง ซึ่งมีนามสกุลเป็น .msi
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 4
Package files คือ ชนิดของชุดติดตั้ง มี 3 แบบ ได้แก่
- As loose uncompressed files เป็นชนิดที่ไม่ต้องบีบอัดชุดไฟล์ติดตั้ง
- In setup file เป็นชนิดที่รวมทุกไฟล์ที่ติดตั้งไว้ที่ไฟล์ .msi
- In cabinet file(s) เป็นชนิดที่แยกเก็บชุดไฟล์ติดตั้งที่ถูกบีบอัดแล้วไว้หลาย ๆ ไฟล์
ซึ่งชนิดนี้เหมาะสาหรับการเก็บชุดไฟล์ติดตั้งในเครือข่าย
ในขั้นตอนนี้ เลือก Package files: เป็นชนิด In setup file
10. เลือก Prerequisites… ที่ช่องของ Installation URL:
จะปรากฏหน้าต่าง Prerequisites… เลือกโปรแกรมที่จาเป็นในการติดตั้ง จากนั้นคลิกปุ่ม OK
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 5
11. เลือก เมนู View > Editor > File System
12. คลิกเลือก Application Folder ในหน้าต่าง Properties ที่ช่อง DefaultLocation กาหนดตาแหน่งการ
ติ ด ตั้ ง เ ข้ า ไ ป ใ น โ ฟ ล เ ด อ ร์ ซึ่ ง ป ร า ก ฏ ดั ง นี้ โ ด ย
[ProgramFilesFolder] ตาแหน่งที่เก็บโฟลเดอร์ และ [Manufacturer] กับ [ProductName] นามาจาก Assembly
13. เลือก Project > Add > Project Output…
เมื่อปรากฏหน้าต่าง เลือก Project ที่ต้องการให้เป็น
Primary Output และคลิกปุ่ม OK
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 6
จากนั้นจะมีการเพิ่ม Primary output มาให้
14. เพิ่ม Folder เพื่อเก็บไฟล์ที่จาเป็นต่อการ
ออกแบบหน้าจอในชุดติดตั้ง โดยคลิกขวาที่ Application
Folder เลือกคาสั่ง Add > Folder
14.1 ตั้งชื่อ Folder ให้สื่อความหมาย เช่น resources
14.2 คลิกขวาที่ Folder resources เลือก Add > File
15. เลือกไฟล์ที่เตรียมไว้ และคลิกเลือก OK
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 7
จะปรากฏไฟล์ที่เลือกในหน้าต่างของ File System
16. เลือกเมนู View > Editor > User Interface เพื่อทาการออกแบบลาดับการทางานของชุดติดตั้ง
จะปรากฏหน้าต่าง User Interface Designer ที่แสดงลาดับการทางานของชุดติดตั้ง
มี 3 ลาดับ คือ ลาดับที่ 1 Start ลาดับที่ 2 Progress
และลาดับที่ 3 End โดยมีรายละเอียดดังนี้
ลาดับที่ 1 Start เป็นการต้อนรับและยืนยันการติดตั้ง
โดยปกติมี 3 หน้าจอ คือ Welcome, Installation Folder และ
Confirm Installation
ลาดับที่ 2 Progress เป็นการติดตั้ง แสดงความคืบหน้า
การติดตั้ง มี 1 หน้าจอ
ลาดับที่ 3 End เป็นการเสร็จสิ้นการติดตั้ง มี 1 หน้าจอ
คือ Finish แต่สามารถเพิ่มตัวเลือกได้ เช่นการกาหนดให้เริ่มต้น
โปรแกรมทันทีที่ติดตั้งเสร็จ หรือกาหนดการอ่านไฟล์ Readme.txt
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 8
17. ที่ Welcome เลือก Properties “BannerBitmap” เพื่อกาหนดรูปโลโก้ที่เราเตรียมไว้ โดย
17.1 เลือก Browse…
17.2 ที่ Look in: เลือก Folder resources ที่เราใส่ข้อมูลเตรียมไว้ จะปรากฏไฟล์ logo.bmp ที่เตรียม
ไว้ ให้เราคลิกเลือกไฟล์ดังกล่าว และคลิกปุ่ม OK
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 9
18. ที่ Start คลิกขวา เลือกคาสั่ง Add Dialog
18.1 เมื่อปรากฏ Dialog Bog “Add Dialog” เลือก Dialog “Read Me” คลิกปุ่ม OK
18.2 คลิกขวา Start > Add Dialog เมื่อปรากฏ Dialog Bog “Add Dialog” เลือก Dialog
“License Agreement” คลิกปุ่ม OK
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 10
19. เมื่อเพิ่ม Dialog Bog จะปรากฏดังภาพ
19.1 จัดลาดับ โดยการคลิกขวาที่ Dialog ที่ต้องการ
แล้วเลือกคาสั่ง Move Up หรือ Move Down ให้ตาแหน่งเป็นไปตามต้องการ
ภาพการจัดลาดับแล้ว
20. กาหนด Properties ของ ReadmeFile
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 11
21. กาหนด Properties ของ License Agreement
22. กาหนด Properties “BannerBitmap” ของ ทุก Diglog เป็น logo.bmp
22.1 คลิกที่ Dialog “Read Me” และเลือก Browse… ที่ Properties “BannerBitmap”
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 12
เลือกไฟล์ logo.bmp
ที่ Dialog “Read Me”
จะปรากฏชื่อไฟล์ logo.bmp ที่
Properties “BannerBitmap”
22.2 กาหนด Properties “BannerBitmap” ของ Diglog “License Agreement” เป็น logo.bmp
ตามขั้นตอนในข้อ 22.1
22.3 กาหนด Properties “BannerBitmap” ของ Diglog “Installation Folder” เป็น logo.bmp
ตามขั้นตอนในข้อ 22.1
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 13
22.4 กาหนด Properties “BannerBitmap” ของ Diglog “Comfirm Installation” เป็น logo.bmp
ตามขั้นตอนในข้อ 22.1
23. คลิกขวาที่ Setup Project เลือก Build
24. คลิกขวาที่ Solution ‘tic tac toe’ เลือก Build Solution
เมื่อ Build เสร็จแล้วจะปรากฏไฟล์ติดตั้งจาก Folder “Release” สามารถคัดลอกไฟล์ใส่ CD หรือ
Flash drive ไปติดตั้งที่เครื่องคอมพิวเตอร์อื่นได้
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 14
ทดสอบการติดตั้ง
นาไฟล์ที่ได้มาติดตั้งในคอมพิวเตอร์ ดังขั้นตอนต่อไปนี้
1. ดับเบิลคลิกที่ไฟล์ Setup1.msi จะปรากฏหน้าต่าง
จากนั้น คลิก Next
2. ปรากฏข้อมูลจากไฟล์ Readme คลิกปุ่ม Next
3. ปรากฏข้อมูลจากไฟล์ License โดยคลิกเลือก
I Agree และคลิกปุ่ม Next
เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 15
4. ปรากฏหน้าจอ
ให้เลือกตาแหน่งที่ตั้งในการติดตั้ง
และคลิก Next
5. ปรากฏหน้าจอให้ยืนยันการติดตั้ง
คลิก Next
6. เมื่อการติดตั้งเสร็จแล้ว คลิกปุ่ม close
เมื่อติดตั้งแล้ว สามารถเข้าสู่โปรแกรมได้ ตัวอย่าง

More Related Content

PPTX
Web browser
PDF
Estudo Antropométrico de uma Sinagoga
PDF
13 proposal software simwas - sistem informasi pengawasan - software inspekto...
PPTX
Pengenalan microsoft word 2007
PDF
Proposal Teknis Sistem Informasi Kepegawaian (SIMPEG)
PDF
Materi TIK kelas 9 Mengenal CMS Blogger.pdf
DOCX
Modul singkat power point
PPT
MATERI KELAS 11 INTERNET
Web browser
Estudo Antropométrico de uma Sinagoga
13 proposal software simwas - sistem informasi pengawasan - software inspekto...
Pengenalan microsoft word 2007
Proposal Teknis Sistem Informasi Kepegawaian (SIMPEG)
Materi TIK kelas 9 Mengenal CMS Blogger.pdf
Modul singkat power point
MATERI KELAS 11 INTERNET

What's hot (16)

PDF
สื่อการเรียนรู้ สร้างได้ สร้างง่าย ด้วยโปรแกรม Adobe Captivate 9
PDF
Gundecha U. - Selenium Testing Tools Cookbook - 2012.pdf
PDF
Burp suite
PDF
Project charter pt karyaindo konstruksi
PDF
MODUL TUTORIAL POWERPOINT 2013
PPTX
Rpl 5-perencanaan proyek perangkat lunak
DOCX
Project Charter
PDF
Mansionieius variandi
PDF
ระบบนำทัวร์เสมือนจริง (Virtual Tour: VR Tour)
PDF
Spesifikasi kebutuhan perangkat lunak sistem akademik kartu hasil studi
PDF
Building Internet Server using CentOS 7 and CentOS Web Panel (CWP)
PDF
Perencanaan manajemen proyek
PPTX
Struktur bahasa delphi
DOCX
New product development on antivirus
DOCX
Makalah cyber law & cyber crime
DOCX
4.2 dasar dasar teknik jaringan komputer dan telekomunikasi-bab 1
สื่อการเรียนรู้ สร้างได้ สร้างง่าย ด้วยโปรแกรม Adobe Captivate 9
Gundecha U. - Selenium Testing Tools Cookbook - 2012.pdf
Burp suite
Project charter pt karyaindo konstruksi
MODUL TUTORIAL POWERPOINT 2013
Rpl 5-perencanaan proyek perangkat lunak
Project Charter
Mansionieius variandi
ระบบนำทัวร์เสมือนจริง (Virtual Tour: VR Tour)
Spesifikasi kebutuhan perangkat lunak sistem akademik kartu hasil studi
Building Internet Server using CentOS 7 and CentOS Web Panel (CWP)
Perencanaan manajemen proyek
Struktur bahasa delphi
New product development on antivirus
Makalah cyber law & cyber crime
4.2 dasar dasar teknik jaringan komputer dan telekomunikasi-bab 1
Ad

Viewers also liked (10)

PDF
การสร้างเมนู ด้วย Menu strip
PDF
กำหนดค่า Link label
PPSX
Setup project (csharp)
PDF
Assistive Technology Contribution Credit (K-42)
PDF
Visual C Sharp 2008 Poster
PDF
Windows Forms For Beginners Part - 4
PDF
Windows Forms For Beginners Part - 2
PPT
Dr archana dhawan bajaj - c# dot net
PPT
06 win forms
PPTX
Windowforms controls c#
การสร้างเมนู ด้วย Menu strip
กำหนดค่า Link label
Setup project (csharp)
Assistive Technology Contribution Credit (K-42)
Visual C Sharp 2008 Poster
Windows Forms For Beginners Part - 4
Windows Forms For Beginners Part - 2
Dr archana dhawan bajaj - c# dot net
06 win forms
Windowforms controls c#
Ad

Similar to Setup Project in Visual Studio C# (20)

PDF
ความสำคัญของคอมพิวเตอร์
PDF
โครงงานโปรเจ็คเวิร์ค
PDF
โครงงานโปรเจ็คเวิร์ค
PDF
(บทที่ 2)
PDF
Projece
PPT
Opensource4
PDF
Course Outline ม.5 ปี 2559
DOC
แผนคอมฯ ม.3 ใหม่
PDF
รายงานคอมพิวเตอร์
DOC
Plan3
PDF
E book desktop auther
ความสำคัญของคอมพิวเตอร์
โครงงานโปรเจ็คเวิร์ค
โครงงานโปรเจ็คเวิร์ค
(บทที่ 2)
Projece
Opensource4
Course Outline ม.5 ปี 2559
แผนคอมฯ ม.3 ใหม่
รายงานคอมพิวเตอร์
Plan3
E book desktop auther

More from Naruemon Soonthong (15)

PDF
Register Animaker
PDF
PDF
ข้อมูล ตัวแปร ตัวดำเนินการ
PDF
คู่มือการใช้โปรแกรมเครื่องคิดเลข
PPTX
คู่มือการใช้โปรแกรมเครื่องคิดเลข
PDF
switch case
PDF
หลักการตั้งชื่อตัวแปร
PPTX
็Hello World! in C#
PDF
Review Csharp
PDF
คะแนนเก็บภาคเรียนที่ 1/2558
PPTX
M5 2 event driven programming
PPTX
Introduction to c sharp
PPT
Eis m1 02principle of computer(2)
PPT
Eis M1 01 principle of computer(1)
Register Animaker
ข้อมูล ตัวแปร ตัวดำเนินการ
คู่มือการใช้โปรแกรมเครื่องคิดเลข
คู่มือการใช้โปรแกรมเครื่องคิดเลข
switch case
หลักการตั้งชื่อตัวแปร
็Hello World! in C#
Review Csharp
คะแนนเก็บภาคเรียนที่ 1/2558
M5 2 event driven programming
Introduction to c sharp
Eis m1 02principle of computer(2)
Eis M1 01 principle of computer(1)

Setup Project in Visual Studio C#

  • 1. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 1 การสร้างชุดติดตั้งแบบ Setup Project การสร้างชุดติดตั้งแบบ Setup Project เป็นการเพิ่มโปรเจ็กต์อีกหนึ่งตัวเข้าไปใน Solution ของแอพพลิเคชันที่พัฒนา Windows Installer เป็นตัวช่วยในการติดตั้งแอพพลิเคชัน ซึ่งมีจุดเด่นดังนี้ - Rollback ถ้าการติดตั้งมีข้อผิดพลาด สามารถย้อนกลับไปที่เกิดข้อผิดพลาดนั้นได้โดยไม่ต้องเริ่มใหม่ทั้งหมด - Self Repair เมื่อแอพพลิเคชันที่ติดตั้งทางานผิดพลาด ซ่อมแซมด้วยตัวแอพพลิเคชันเองได้ - Uninstall ทาการถอนการติดตั้งได้ทั้งหมด ลบทุกไฟล์ ไม่เหลือไฟล์ขยะ หรือรีจิสทรีขยะ - Advertisement แทรกโฆษณา หรือข้อมูลที่ช่วยให้ผู้ใช้งานมั่นใจ และเข้าใจแอพพลิเคชันนั้น ๆ ได้ ไฟล์ที่ใช้ในการติดตั้งแบบ Setup Project - ไฟล์โปรเจ็กต์ที่ทดสอบแล้ว - ไฟล์ Readme.rtf เป็นไฟล์คาแนะนาเกี่ยวกับแอพพลิเคชัน - ไฟล์ License.txt เป็นไฟล์ข้อมูลเกี่ยวกับลิขสิทธิ์ - ไฟล์ logo.bmp เป็นไฟล์ภาพโลโก้ในชุดติดตั้ง (ควรมีขนาด 700 X 50) วิธีสร้างชุดติดตั้ง 1. เปิดโปรเจ็กต์ที่ทดสอบแล้ว และเข้าสู่หน้าต่าง Project > Properties… 2. เลือก Application และคลิกเลือก Assembly Information… 3. เมื่อปรากฏหน้าต่าง Assembly Information แก้ไขรายละเอียดของโปรแกรม ได้แก่ Title คือ ชื่อโปรแกรม Description คือ รายละเอียด เช่น ติดตั้งโปรแกรมแปลงหน่วยสกุลเงิน Company คือ บริษัท/ผู้เขียนโปรแกรม เช่น นักเรียนชั้น ม.5@บบว. Product คือ เกี่ยวกับโปรแกรม เช่น โปรแกรมแปลงหน่วยสกุลเงิน Copyright คือ ลิขสิทธิ์ เช่น Copyright © 2017 เป็นต้น
  • 2. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 2 4. เลือกเมนู Build > Build tic tac toe 5. เลือกเมนู File > Add > New Project… 6. เมื่อปรากฏหน้าต่าง Add New Project เลือก Installed Templates 6.1 เลือก Other Project Types > Setup and Deployment > Visual Studio Installer 6.2 คลิกเลือก Setup Project 6.3 ตั้งชื่อ Setup1 6.4 คลิก OK
  • 3. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 3 7. จะปรากฏหน้าต่าง File System ของไฟล์ Setup1 8. คลิกขวาที่ Setup1 และเลือกคาสั่ง Properties 9. ปรากฏหน้าต่าง Setup1 Property Pages Output file name คือ ชื่อของไฟล์ติดตั้ง ซึ่งมีนามสกุลเป็น .msi
  • 4. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 4 Package files คือ ชนิดของชุดติดตั้ง มี 3 แบบ ได้แก่ - As loose uncompressed files เป็นชนิดที่ไม่ต้องบีบอัดชุดไฟล์ติดตั้ง - In setup file เป็นชนิดที่รวมทุกไฟล์ที่ติดตั้งไว้ที่ไฟล์ .msi - In cabinet file(s) เป็นชนิดที่แยกเก็บชุดไฟล์ติดตั้งที่ถูกบีบอัดแล้วไว้หลาย ๆ ไฟล์ ซึ่งชนิดนี้เหมาะสาหรับการเก็บชุดไฟล์ติดตั้งในเครือข่าย ในขั้นตอนนี้ เลือก Package files: เป็นชนิด In setup file 10. เลือก Prerequisites… ที่ช่องของ Installation URL: จะปรากฏหน้าต่าง Prerequisites… เลือกโปรแกรมที่จาเป็นในการติดตั้ง จากนั้นคลิกปุ่ม OK
  • 5. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 5 11. เลือก เมนู View > Editor > File System 12. คลิกเลือก Application Folder ในหน้าต่าง Properties ที่ช่อง DefaultLocation กาหนดตาแหน่งการ ติ ด ตั้ ง เ ข้ า ไ ป ใ น โ ฟ ล เ ด อ ร์ ซึ่ ง ป ร า ก ฏ ดั ง นี้ โ ด ย [ProgramFilesFolder] ตาแหน่งที่เก็บโฟลเดอร์ และ [Manufacturer] กับ [ProductName] นามาจาก Assembly 13. เลือก Project > Add > Project Output… เมื่อปรากฏหน้าต่าง เลือก Project ที่ต้องการให้เป็น Primary Output และคลิกปุ่ม OK
  • 6. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 6 จากนั้นจะมีการเพิ่ม Primary output มาให้ 14. เพิ่ม Folder เพื่อเก็บไฟล์ที่จาเป็นต่อการ ออกแบบหน้าจอในชุดติดตั้ง โดยคลิกขวาที่ Application Folder เลือกคาสั่ง Add > Folder 14.1 ตั้งชื่อ Folder ให้สื่อความหมาย เช่น resources 14.2 คลิกขวาที่ Folder resources เลือก Add > File 15. เลือกไฟล์ที่เตรียมไว้ และคลิกเลือก OK
  • 7. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 7 จะปรากฏไฟล์ที่เลือกในหน้าต่างของ File System 16. เลือกเมนู View > Editor > User Interface เพื่อทาการออกแบบลาดับการทางานของชุดติดตั้ง จะปรากฏหน้าต่าง User Interface Designer ที่แสดงลาดับการทางานของชุดติดตั้ง มี 3 ลาดับ คือ ลาดับที่ 1 Start ลาดับที่ 2 Progress และลาดับที่ 3 End โดยมีรายละเอียดดังนี้ ลาดับที่ 1 Start เป็นการต้อนรับและยืนยันการติดตั้ง โดยปกติมี 3 หน้าจอ คือ Welcome, Installation Folder และ Confirm Installation ลาดับที่ 2 Progress เป็นการติดตั้ง แสดงความคืบหน้า การติดตั้ง มี 1 หน้าจอ ลาดับที่ 3 End เป็นการเสร็จสิ้นการติดตั้ง มี 1 หน้าจอ คือ Finish แต่สามารถเพิ่มตัวเลือกได้ เช่นการกาหนดให้เริ่มต้น โปรแกรมทันทีที่ติดตั้งเสร็จ หรือกาหนดการอ่านไฟล์ Readme.txt
  • 8. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 8 17. ที่ Welcome เลือก Properties “BannerBitmap” เพื่อกาหนดรูปโลโก้ที่เราเตรียมไว้ โดย 17.1 เลือก Browse… 17.2 ที่ Look in: เลือก Folder resources ที่เราใส่ข้อมูลเตรียมไว้ จะปรากฏไฟล์ logo.bmp ที่เตรียม ไว้ ให้เราคลิกเลือกไฟล์ดังกล่าว และคลิกปุ่ม OK
  • 9. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 9 18. ที่ Start คลิกขวา เลือกคาสั่ง Add Dialog 18.1 เมื่อปรากฏ Dialog Bog “Add Dialog” เลือก Dialog “Read Me” คลิกปุ่ม OK 18.2 คลิกขวา Start > Add Dialog เมื่อปรากฏ Dialog Bog “Add Dialog” เลือก Dialog “License Agreement” คลิกปุ่ม OK
  • 10. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 10 19. เมื่อเพิ่ม Dialog Bog จะปรากฏดังภาพ 19.1 จัดลาดับ โดยการคลิกขวาที่ Dialog ที่ต้องการ แล้วเลือกคาสั่ง Move Up หรือ Move Down ให้ตาแหน่งเป็นไปตามต้องการ ภาพการจัดลาดับแล้ว 20. กาหนด Properties ของ ReadmeFile
  • 11. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 11 21. กาหนด Properties ของ License Agreement 22. กาหนด Properties “BannerBitmap” ของ ทุก Diglog เป็น logo.bmp 22.1 คลิกที่ Dialog “Read Me” และเลือก Browse… ที่ Properties “BannerBitmap”
  • 12. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 12 เลือกไฟล์ logo.bmp ที่ Dialog “Read Me” จะปรากฏชื่อไฟล์ logo.bmp ที่ Properties “BannerBitmap” 22.2 กาหนด Properties “BannerBitmap” ของ Diglog “License Agreement” เป็น logo.bmp ตามขั้นตอนในข้อ 22.1 22.3 กาหนด Properties “BannerBitmap” ของ Diglog “Installation Folder” เป็น logo.bmp ตามขั้นตอนในข้อ 22.1
  • 13. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 13 22.4 กาหนด Properties “BannerBitmap” ของ Diglog “Comfirm Installation” เป็น logo.bmp ตามขั้นตอนในข้อ 22.1 23. คลิกขวาที่ Setup Project เลือก Build 24. คลิกขวาที่ Solution ‘tic tac toe’ เลือก Build Solution เมื่อ Build เสร็จแล้วจะปรากฏไฟล์ติดตั้งจาก Folder “Release” สามารถคัดลอกไฟล์ใส่ CD หรือ Flash drive ไปติดตั้งที่เครื่องคอมพิวเตอร์อื่นได้
  • 14. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 14 ทดสอบการติดตั้ง นาไฟล์ที่ได้มาติดตั้งในคอมพิวเตอร์ ดังขั้นตอนต่อไปนี้ 1. ดับเบิลคลิกที่ไฟล์ Setup1.msi จะปรากฏหน้าต่าง จากนั้น คลิก Next 2. ปรากฏข้อมูลจากไฟล์ Readme คลิกปุ่ม Next 3. ปรากฏข้อมูลจากไฟล์ License โดยคลิกเลือก I Agree และคลิกปุ่ม Next
  • 15. เอกสารประกอบการเรียนการสอนเทคโนโลยีสารสนเทศ ชั้นมัธยมศึกษาปีที่ 5 โดยครูนฤมล สุนทอง 15 4. ปรากฏหน้าจอ ให้เลือกตาแหน่งที่ตั้งในการติดตั้ง และคลิก Next 5. ปรากฏหน้าจอให้ยืนยันการติดตั้ง คลิก Next 6. เมื่อการติดตั้งเสร็จแล้ว คลิกปุ่ม close เมื่อติดตั้งแล้ว สามารถเข้าสู่โปรแกรมได้ ตัวอย่าง