โทรศัพท์

ต่อจากการสอนครั้งล่าสุด เราจะเรียนรู้วิธีใช้แปรงและสไตล์สีที่กำหนดเองกับตัวควบคุม Windows Phone Apps ในส่วนนี้ ในบทแนะนำล่าสุดเราได้เรียนรู้วิธีใช้สไตล์และธีมของรีซอร์สกับตัวควบคุมของเรา ตอนนี้ในส่วน tutorial series

ของเราเราจะยังคงทำงานกับสไตล์และทรัพยากรต่างๆและเรียนรู้วิธีใช้ทรัพยากรสีที่เราเลือก

เริ่มต้นทำงานกับโครงการเดียวกันกับที่เราสร้างขึ้นในบทแนะนำล่าสุด ด้วยปุ่มเดียว เลือกปุ่มนั้นและมุ่งหน้าไปยังหน้าต่างคุณสมบัติ เมื่อคุณคลิกที่ปุ่มลูกศรขนาดเล็กที่อยู่ถัดจากคุณสมบัติเบื้องหน้าคุณจะสังเกตเห็นว่ามีหน้าต่างเล็ก ๆ อีกบานหนึ่งเปิดด้วยโทนสีและแท็บต่างๆ มีสี่แท็บเล็ก ๆ ในหน้าต่างเล็ก ๆ นั่นคือ Null Brush, Solid Color Brush, Gradient Brush และ Image Brush โดยค่าเริ่มต้นจะมีการตั้งค่าเป็นแปรงทึบที่มีสีขาว (RGB: 0,0,0 และตั้งค่าความโปร่งใสของช่อง alpha เป็น 255) คุณสามารถเลือกสีที่ต้องการได้โดยเลื่อนแถบเลื่อนไปตามแนวตั้งแล้วเคอร์เซอร์แบบวงกลมเพื่อเลือกเฉดสีที่แน่นอน นอกจากนี้คุณยังสามารถเลือก iDropper โดยใช้ที่คุณสามารถใช้สีของเครื่องมือใดก็ได้ มีหลายวิธีในการปรับเปลี่ยนสีบนแปรงสีทึบนี้

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

ตอนนี้ให้ใช้แปรงสีไล่ระดับสีโดยใช้จุดหยุดเช่นฉันได้ทำ (ดูภาพ) ตอนนี้ถ้าคุณเห็นหน้าต่าง XAML คุณจะเห็นว่ามีการเพิ่มโค้ดลงในหน้าต่าง XAML สำหรับปุ่ม

สมมติว่าถ้าเราต้องการเพิ่มสีไล่ระดับสีเดียวกันที่เราเพิ่มไว้สำหรับปุ่มของเราไปยังส่วนควบคุมอื่น ๆ ทั้งหมดบนหน้าของเรา เราจะทำอย่างไร? สำหรับการไปที่คุณสมบัติเบื้องหน้าที่เรากำหนดแปรงสีขี้ขลาดไล่ระดับสีและคลิกขวาที่มันและเลือก "Extract ค่าไปยังทรัพยากร" จะเปิดหน้าต่างป๊อปอัป "Create Resource" เล็ก ๆ คุณสามารถตั้งชื่อรีซอร์สได้ตามที่ต้องการหรือสามารถออกได้ตามที่เป็นอยู่ จากนั้นคุณสามารถเลือกตำแหน่งที่คุณต้องการบันทึกได้ขึ้นอยู่กับตำแหน่งที่คุณต้องการใช้ทรัพยากรนี้ ถ้าคุณต้องการใช้ในหน้าเดียวให้เลือก MainPage.xaml อื่น ๆ เลือก App.xaml และคลิกที่ Ok

ตอนนี้ลากปุ่มอื่นบนพื้นผิวของนักออกแบบและไปที่คุณสมบัติเบื้องหน้า ตอนนี้คุณจะพบทรัพยากรที่กำหนดเองของเราภายใต้ชื่อรีซอร์สท้องถิ่น เมื่อคลิกแล้วคุณจะเห็นปุ่มที่สองซึ่งมีสีเดียวกับปุ่มแรก จะเกิดอะไรขึ้นถ้ามีคุณสมบัติหลายอย่างที่เราต้องการนำไปใช้กับการควบคุมของเรา? เราสามารถทำได้โดยใช้สไตล์ สไตล์เป็นชุดของสถานที่ให้บริการ setters ให้เราสร้างสไตล์ใหม่ในขณะนี้ ก่อนอื่นให้ลบการปรับเปลี่ยนทั้งหมดที่เราทำไว้ในตัวอย่างสุดท้ายและได้ปุ่มใหม่สำหรับการเริ่มต้นใหม่ วางรหัสต่อไปนี้ไว้ด้านล่างการประกาศ xmlsns

ในโค้ดนี้เราได้สร้างคุณสมบัติ setter สองเพื่อเปลี่ยนสีขอบและสีพื้นหน้า หลังจากนี้ไปที่โค้ดของปุ่มและเพิ่มโค้ดนี้:

Style = "{StaticResource myStyle}".

คุณจะสังเกตเห็นว่าสีของปุ่มและสีพื้นหน้าของเราเปลี่ยนเป็นสีแดง

ตอนนี้ถ้าคุณต้องการ เมื่อต้องการใช้ลักษณะนี้กับแอ็พพลิเคชันทั้งหมดของคุณให้ตัดรหัสระหว่าง เปิดไฟล์ App.xaml และวางในระหว่างแท็กทรัพยากรแอ็พพลิเคชัน ตอนนี้ถ้าคุณกลับไปตรวจสอบปุ่มคุณจะเห็นปุ่มที่ยังคงแสดงเป็นสีแดง