(อาจารย์สุธิรา) ใช่ไหม ก็จะเป็นหน้าล็อกอินนะ และหน้าสุดท้าย ก็คือถ้าเรามีตัวที่จะเข้าไปจากเมื่อล็อกอินเสร็จแล้วเข้าไป ก็คือทำเป็นหน้า หน้าต้อนรับก็ได้ เพิ่มอีกหน้าหนึ่งนะคะ อันดับแรกในครั้งก่อนมีหน้าที่ 1 แล้ว หน้าที่ 2 มันทำเหมือนกันเด็ก ๆ ดูตรงนี้นะคะ วิธีการ ให้เราไปที่ ตำแหน่ง Screen อันที่ 1 แล้วไปที่ตำแหน่งที่ Screen นั้นใช่ไหม แล้วคลิกที่ตำแหน่งที่ Screen แล้วคลิกที่ตัวจุด 3 จุด เห็นไหมคะ ตำแหน่งหน้าต่างทางขวามือเห็นไหม แล้วมันจะมีคำว่า "Duplicate" คือ Duplicate นี่มันมาจากการ Copy แล้วก็วาง คือมันรวบ ctrl + C trl + V มาเป็น Duplicate เลย ไม่ต้องไปกด Ctrl + C ดูนะคะ ทำให้ดู กดปุ๊บ มันก็จะถาม แน่ใจไหมที่จะทำการทำสำเนา หรือสำรองหน้านี้ ถ้าแน่ใจให้เรากดที่ Duplicate เห็นไหม มันก็จะได้หน้าเพิ่มขึ้นมา หน้าตาเหมือน... ตรงนี้นะ ที่มันขึ้นสัญลักษณ์รูปถังขยะถึงจะลบได้ อ่าว เปิด Thunkable นะ เปิดตัว Thunkable เว็บ Thunkable แล้วก็ล็อกอินเข้าไป จำได้อยู่นะถ้าใครเข้าถูก มันจะขึ้น Project ที่เราทำไว้ใช่ไหมนี่ มันจะต้องขึ้นอย่างนี้ มีชื่อโปรเจกต์ทำไว้ในครั้งก่อน ๆ ขึ้นมา จำได้ใช่หรือเปล่า Account ตัวเองที่ใช้ ในการเข้าสู่ Thunkable ชื่ออะไร เมื่อกี้บอกว่าตอนแรกมีหน้าเดียวใช่ไหม ตอนนี้ให้เพิ่ม หน้าที่ 2 วิธีเพิ่มให้มันได้เหมือนกัน หน้าที่ 1 กับหน้าที่ 2 เหมือนกันนี่ ให้ไปที่ screen ที่ 1 คลิกอันแรก คลิกอันที่ 1 เสร็จแล้วมาที่ตำแหน่งนี้ เห็นไหม จุด 3 จุด ทางมุมซ้าย แล้วก็เลือกคำว่า "Duplicate" อันที่ 2 เลือกอันที่ 2 เห็นหรือเปล่าคลิก 1 ครั้ง มันก็จะถามว่าต้องการไหม เราก็คลิกที่คำว่า "Duplicate" เห็นหรือเปล่าเด็ก ๆ ก็จะได้หน้าที่เหมือนกันเลย เปลี่ยนตรงปุ่ม หน้าที่ 1 ให้ปุ่มจะชื่อว่า Sign in นะ แต่ในหน้าที่ 2 ปุ่มต้องเป็น Login นะคะ อันนี้เพิ่มแล้วลบออกได้ แล้วก็เพิ่มหน้าอีกหน้าหนึ่ง เพื่อที่เรากด login เข้าไปแล้วปุ๊บ ถ้ามันถูกใช่ไหม มันก็ควรเข้าไปสู่หน้าที่เป็นเนื้อหานะ เพราะฉะนั้น เพิ่มหน้าเนื้อหานะคะ ก็หารูปใส่แล้วก็พิมพ์ข้อความ ชื่อแอปเราก็ได้ใส่เข้าไปเพิ่มอีก 1 หน้า อันนี้เพิ่มเอง แต่งเอง นึกออกนะ เพราะฉะนั้น ตอนนี้ที่เราจะต้องมีเพื่อเขียน Coding ได้น่ะ เราต้องมีทั้งหมด 3 3 Screen 3 หน้าจอนะคะ ดูดี ๆ นะ หน้าจอที่ 1 ก็คือหน้าจอสำหรับ Sign in เข้าไปใช่ไหมคะ หน้าจอที่ 2 จะเป็นหน้าจอ Login นะ Sign in นั้นหมายถึงคือ เหมือนตอนเราเข้าเว็บ(ไซต์)ใหม่ ๆ เรายังไม่มีใช่ไหม ไม่มี User เราก็ต้องลงทะเบียนเขาก่อน เขาเรียกว่าอะไรล่ะ ใส่ Username กับ Password ใช่ไหมคะ นั่นหมายถึง เมื่อเราลงทะเบียนไปแล้ว แล้วครั้งหน้า ถ้าเรามาเพื่อจะ Login นึกถึงนะ เราก็แค่กรอก Username เราแล้วก็Password ถูกไหม แล้วพอกด Login มันจะเข้าไปทำแอปได้ หรือไปดูข้อมูลในแอปได้ เพราะฉะนั้น ก็เลยให้มี 1, 2, 3 3เมื่อกดแล้ว กดจากนี่ปุ๊บนะ พอลงทะเบียนเสร็จ มันจะให้ทวนว่าคุณลอง Login เข้าไปใช่ไหม พอ Login เข้าไปเสร็จ ถ้าเข้าได้ มันก็จะมาเปิดหน้านี้นะคะ เพราะฉะนั้น ต้องมีอย่างน้อย 3 หน้า ไอ้หน้าที่ 3 สร้างใหม่นะคะ ใส่รูปแล้วก็ข้อความ เพื่อให้รู้ว่าเป็นแอปนี้นะ ชื่อแอปนี้นะ อีกอันหนึ่งพอ แค่นั้น โอเคนะคะ ตอนนี้เราจะต้องมีทั้งหมด 3 หน้าแล้วนะ ทีนี้เราจะเริ่มมา Code แล้วนะคะ ก่อนจะ Code เช็กก่อนนะคะ ในหน้าแรก ก็คือหน้า Sign in ตั้งชื่อสลับกัน ดูชื่อนะ ของเรามันก็ต้องเป็นอะไรนะ ไม่ใช่ Login มันต้องเป็นอะไร Sign in นะคะ s-i... Sign in นะ s-i-g-n จะได้ไม่สับสน ตอนนี้สับสนเองแล้ว แก้ไปแก้มาหลายรอบ งง อันนี้ก็ต้องเป็น Login นะ นะคะ เราก็จะมีหน้า Sign in 1 หน้า login 1 หน้า แล้วก็หน้าแรกก็ได้ First ก็ได้นะคะ เปลี่ยน เพราะไม่ได้พิมพ์คำว่า "Welcome" ก็พิมพ์ First App ก็ได้ First Page ไม่ก็หน้าเพจ หน้าแอปก็ได้ นะคะ ก็คือเข้ามาที่หน้าแรกของแอปเรา สิ่งที่จะต้องมีเพิ่มในหน้า Login นะคะ เด็ก ๆ เห็นไหม แม่มีกรอบเปล่า ๆ นี่อยู่ตรงนี้ 1 อันอยู่ด้านล่างนี่ เพราะอะไร เพราะว่าบางทีให้นึกถึงนะ บางคนพอเวลา Login แล้วกรอกผิดน่ะ มันควรจะมีการแจ้งเตือนใช่ไหมคะ ว่าไอ้ที่เรากรอกน่ะมันไม่ถูก สิ่งที่จะใส่มาตรงนี้นะคะ ก็คือใส่ label เด็ก ๆ คลิกที่ Label แล้วเอามาวาง แล้วตรงตำแหน่งนี้ ให้คลิกที่กากบาท ให้มันเป็น Emtry ให้ label มันเป็นเปล่า ๆ เพราะมา Label ครั้งแรก เดี๋ยวทำให้ดูนะคะ ถ้าเราเลือก Label ครั้งแรก แล้วเอามาวาง มันจะมีคำว่า "Label" อยู่ใช่ไหมลูก เห็นหรือเปล่า ให้เราคลิกที่ลบนี่ มันจะหายไปใช่ไหมแล้วที่เป็นกรอบข้อความเฉย ๆ น่ะ แต่อันนี้ไม่ได้อยู่ที่ Sign in นะ ให้อยู่ที่ไหนคะ ให้ไปเตือนที่ login นะ ใช่ ๆ เตือนที่ Login ตอนแสดงให้ดูเฉย ๆ ว่าถ้าเอา Label เห็นหรือเปล่า เห็นไหมคะ เอาไว้ที่หน้า Login นะคะ จะเอาไว้ข้างบนหรือข้างล่างแล้วแต่นะ เปลี่ยนตำแหน่งก็ได้นะคะ เอาไว้ก่อน Button ก็ได้ เอา Button ลงมา แล้วเอาไอ้แจ้งเตือนขึ้นมาก่อนก็ได้ หรือแจ้งเตือนไว้ข้างหลังก็ได้ ก็แล้วแต่จัดตำแหน่งนะคะ เดี๋ยวแม่วางไว้ข้างล่างอย่างนี้นะคะ ตรงข้อความในนี้ Label น่ะ ถ้าทำให้มันหาย ก็คือคลิกที่เครื่องหมายกากบาทตรงนี้ มันจะเป็น Empty tring นะคะ แล้วมันจะขึ้นเตือนได้อย่างไร แม่ไม่ใส่ข้อความ ก็เราจะไปเขียนโค้ดไงคะ ให้มันไปขึ้นตอนที่เรากดปุ่ม Login แล้วข้อมูลที่ Username ที่เราใส่ มันไม่ถูกน่ะ มันถึงจะขึ้นนะ ทีนี้มาดู อันดับแรก หน้าแรกก่อนเราต้องไปตั้งค่าที่หน้าแรกก่อน หน้า Sign in ก่อนนะ สิ่งที่เราจะต้องใส่ Coding เข้าไปนะคะ นึกถึงง่าย ๆ ก็คือหลักการ ก็คือเวลาจะ Sign in เวลาเราจะให้เขากรอก Username ใช่ไหมคะ แล้วก็ Password 2 ตัว เมื่อกรอกเสร็จแล้วให้มากดปุ่ม Sign in ใช่ไหม นะคะ ก็คือพอเปิดเข้ามาปุ๊บ ให้คนที่ใช้แอปเราเขากรอก Username นะคะ แล้วก็ Password ลงไป เมื่อกรอกเสร็จนะคะ ให้กดปุ่ม Sign in ทีนี้ ไอ้สิ่งที่กรอกที่ มันจะเอาไปเก็บไว้ไหนใช่ไหม เพื่อจะเช็กได้ว่า เช็กได้ว่าที่กรอกลงมานี้เมื่อเวลาไป Login แล้วมันใช่ Username ที่เคยกรอกไปไหม มันใช่ Password ที่เคยกรอกไปไหมนะคะ แล้วมันก็จะสามารถ Login เพื่อไปสู่หน้าที่เป็นหน้าแรกนี้ได้ มาดูที่อันดับแรกก่อน สิ่งที่เราจะเก็บ ก็คือ Username กับ Password เราจะเก็บมันได้ก็ต่อเมื่อเราทำสิ่งนี้นะคะ พร้อมจะเขียนโค้ดแล้ว ไปที่หน้า Sign in นะ หน้าแรกนะ แล้วเลือก Block ของเรานะเพื่อเราจะเขียน Coding นะ สิ่งแรกที่เด็ก ๆ จะต้องมีนะคะ ก็คือให้เด็ก ๆ คลิกที่คำว่า Variable เราต้องประกาศตัวแปรก่อนลูก เพราะว่าอะไร เพราะว่าเราจะเอา Username กับ Password ไปเก็บได้แล้วเราจะเอามันไปเก็บที่ไหน คอมพิวเตอร์มันจะรู้ได้อย่างไร ก็ต้องประกาศตัวแปรเพื่อที่จะ เพราะฉะนั้น เด็ก ๆ ต้องไปเลือกที่คำว่า "Variable" เห็นไหมคะ แล้วให้เลือกคำว่า "Interlize"เหมือนบอกว่าแปลเป็นไทย ฉันจะประกาศอันนี้นะคะ ชื่อนี้ เป็น Variable ชื่ออะไรนะ ลากตัวนี้ออกมาวาง 1 อันนะคะ แต่บอกแล้ว เรามีตัวแปรที่จะต้องประกาศกี่ตัวคะ 2 ตัวนะลูก เพราะฉะนั้น ต้องลากออกมากี่อัน 2 อันใช่ไหมคะ ให้ได้ 2 ตัว เหมือนที่แม่ลากนี่ เหมือนตัวอย่าง ลากตัว... นะถ้าเป็นเกี่ยวกับตัวแปรก็ไปที่ Variable คำว่า "ประกาศตัวแปร" ก็คือ Intailize อย่างนี้ ลากมาอย่างนี้ 2 อันนะคะ ตรงคำว่า "แอป" ตรงคำว่าไอ้นี่คืออะไร บอกให้รู้ว่าตัวแปรนี้ คลิกไปที่อะไรนะ รูปที่เหมือนiสามเหลี่ยมชี้ลงน่ะ นะคะ เห็นไหม มันมี app มี store แล้วก็มี Cloud ให้เราเลือกคลาวด์นะคะ ทั้ง 2 เลย เก็บไว้บนคราวด์เลย เพราะ เพราะอะไร เพราะแอปเราออนไลน์นะ ก็คือแต่ถ้าเมื่อใดที่เราเอาแอปไปลงในมือถือ นึกออกนะ ที่เก็บมันก็จะเปลี่ยน นึกออกนะคะ อาจจะเก็บไว้ที่ Store เลยก็ได้ ถ้าเก็บไว้ที่ Cloud มันก็จะไปเปิดฐานข้อมูลในคลาวด์เรานะ เดี๋ยวนี้ก็น่าจะเก็บไว้ในคลาวด์แล้วล่ะ โอเคนะคะ เลือกตรงนี้เป็น cloud ทั้ง 2 เลย แล้วตรง name ก็พิมพ์เพื่อเปลี่ยนใช่ไหมคะ Variable ตัวแรกชื่อว่าอะไร ตัวแปรแรก ก็คือ User ตัวแปรที่ 2 สำหรับ pass หรือ Password สำหรับเก็บ Password เห็นไหมคะ สิ่งที่จะต้องเปลี่ยน ก็คือตรงที่เก็บข้อมูล จากเดิมมันเป็นแอป ให้เปลี่ยนเป็น cloud ตรง Name ให้เปลี่ยนเป็น cloud พิมพ์ชื่อตัวแปรลงไป ซึ่งตั้งชื่อว่าตัวแปร user สำหรับเก็บ username และก็ตัวแปร Pass สำหรับเก็บ Password เมื่อประกาศตัวแปรเสร็จแล้ว เพราะหน้า Sign in คือ ตัวแรกที่เราจะรับเลยนะ เมื่อได้ตัวแปรเสร็จ สิ่งที่จะเกิดต่อมา ก็คือเมื่อมีการทำอะไรคะ ให้ดูหน้าดีไซน์เรานะ เมื่อกี้ที่อธิบายนะ username password โดนกรอกเข้ามาปุ๊บปุ่ม Sign in ใช่ไหมคะ เพราะฉะนั้น สิ่งที่จะต้องสั่งให้มันกระทำนั้นเอง สิ่งนี้เมื่อโดนกด มันจะเกิดอะไรขึ้นนะ เพราะฉะนั้น กลับไปที่ block เรานะ ได้ประกาศตัวแปรมาแล้ว เห็นไหมคะ ส่วนที่ควบคุม เราจะอยู่ที่ส่วนของ Control เด็ก ๆ สังเกตสี สีของ Block เห็นไหม แม่เลือกใช้ตัวไหน สีมันก็จะเป็นตัวนั้น เห็นไหมคะ เหมือนสีส้มมันก็จะไปที่สีแดงตัวนี้ นี่สี้หลืองอย่างนี้ ก็คืออยู่ที่ Control ส่วนของ Control ทั้งหมดทั้งปวง ทีนี้ คำสั่ง ก็คือเมื่อเราไปกดปุ่ม เห็นไหมคะ ต้องไปหา Control ที่คลิก ๆ ก่อนจะหาตัวนั้น เดี๋ยว ๆ ต้องไปเลือกปุ่มเราก่อน ตรง... เราอยู่ในหน้า sign in เราคลิกที่ปุ่ม Button เราก่อนนะคะ แล้วมันก็จะเจอ Button คลิกนะ เราต้องเลือกที่ เมื่อมีการกดที่ปุ่มนี้ ต้องคลิกตรงนี้ก่อน มันถึงจะไปตัวต่อไปได้ เด็กก็ลากคำสั่งนี้ออกมา เห็นไหมคะ ต้องคลิกที่ตัวปุ่มก่อนนะ ดูดี ๆ นะ ดูวิธีการใหม่นะ Sign in คลิกนี่ จะขึ้นก็ต่อเมื่อเราไปคลิกที่ปุ่ม เห็นไหมคะ ตัว Object เรา ก่อนเห็นหรือเปล่า แล้วก็ลากออกมา ให้มันทำอะไร เมื่อกดแล้ว มันไปไหน เห็นไหมคะ Navigation Tool ถูกไหม sign in กด sign in มันต้องไปที่อันที่ 2 ก็คืออะไรคะ Login ถูกไหมคะ พอลงชื่อไอ้นี่เสร็จเรียบร้อย มันต้องไปที่ login นะ เราก็เลือก Screen เป็น Navigation Tool เมื่อปุ่ม Sign in โดนกดให้ ไปที่หน้า Login เห็นไหมเงื่อนไข เงื่อนไขบอกว่า เมื่อปุ่ม Sign in ถูกคลิกนะ สิ่งที่จะต้องทำ ก็คือนำทางไปยัง Screen LoginScreen Login หน้า Login นั่นเอง เห็นไหมคะ แต่ทีนี้มันขึ้นหน้าอย่างนี้ได้ ก็ต่อเมื่อเราต้องไปเซตตัวแปรที่มันป้อนเข้าไปด้วยก่อน เห็นไหมคะ คำว่า "Set Cloud Variable User ดูสีก็รู้ Variable ตอนนี้เด็ก ๆ ได้เป็น Button คลิกหรือยัง ได้แล้วนะ แล้ว บอกว่าให้มัน Navigation to login แล้วนะ ต่อมา ก็คือก่อนมันจะไปหน้านี้ได้เราจะต้องป้อนข้อมูล เข้าไปก่อนใช่ไหม เพราะฉะนั้น เราต้องไปที่ Variables ก่อนค่ะ แล้วเลือก Set เห็นไหมคะ กำหนดค่าตัวแปร นี่ เอาตัวนี้มาต่อ ต่อตรงไหน ตรงท้ายไอ้ Cloud เอ้ย ตรง Do น่ะค่ะ ตัวแปรเรามี User กับอะไรคะ User กับ Password เพราะฉะนั้น ไม่เห็นมี word เลือกมาสิ เลือกมา 2 อัน แล้วมาเปลี่ยนสิ นี่ไง ไม่ขึ้นหรือ อันไหนไม่ขึ้น Set อยู่ที่ตัวแปรนะคะ โอเคนะ ทันแล้วนะ ไปที่ตัวแปรนะคะ ทีนี้ไปตัวแปร แล้วเลือกคำว่า "ฆet" เห็นไหมคะ Cloud Variable เพราะเมื่อกี้พอเราสร้างเสร็จแล้ว มันก็จะขึ้นมาให้ลากออกมาแล้วมาเปลี่ยนชื่อตรงนี้ ตัวที่ 2 เป็น Password โอเคไหมลูก โอเคนะ สิ่งที่จะลากต่อมา ก็คือเห็นไหมคะ มันจะมีต่อว่าเมื่อกำหนดค่าให้ตัวแปร Password แล้ว =ให้มันไปทำอะไร ให้ Text input นะ Text input เดี๋ยวนะ นี่เห็นไหม text input เด็ก ๆ จะต้องมาเลือกไอ้ Text ตัวที่ 1 ของเราน่ะ ก็คือ Username น่ะ ดูนะคะ สิ่งที่จะมาเลือก คือ ส่วนนี้นึกออกไหมลูก เพราะฉะนั้น ก็ไปที่ Block ให้เด็ก ๆ มาคลิกที่ิสิ่งที่จะลากมาใส่ต่อตรงนี้ ให้คลิกที่นีนึกออกไหมลูก เพราะฉะนั้น ก็ไปที่ Block ให้เด็ก ๆ มาคลิกที่UI Component น่ะ ของเราเห็นไหม เห็นไหม แล้วให้เลือกที่ ที่มันขึ้นคำว่า "Text input username" Text นะคะ ตัวนี้ตัวที่ 2 นะคะ มันมี hit กับ text ใช่ไหมลูก เราเลือกนะลูก นี่เอามาต่อ อันนี้ password ใช่ไหมคะ เพราะฉะนั้น ก็ต้องเลือก Text input อะไร Password นะ แป๊บ ขยายให้มันดูใหญ่ขึ้น ไหนไอ้... เล็กไป ๆ ใหญ่เกิน ล้น ใหญ่สุดแล้ว ใหญ่กว่านี้ก็ล้นอีกเห็นไหม ถ้า 200 ใหญ่ไป เดี๋ยวนะ นะ ตอนเลือก เราต้องเลือกตัววัตถุน่ะ วัตถุที่เราจะใช้ทำด้วย เพราะฉะนั้น ต้องเลือกให้ถูกอันนะ เพราะฉะนั้น เราต้องเลือกที่ตัววัตถุเราก่อนนะ มันแล้วมันก็จะขึ้นไอ้พวก Control นั้นขึ้นมาน่ะลูก ทีนี้ เดี๋ยว ๆ ลืม ลืมให้เช็ก ตรง Design ก่อน เด็ก ๆ คลิกกลับไปที่ Design ก่อนค่ะ เช็กตรงช่องนี้ก่อน ช่องแรกก่อน ตรงเห็นไหมคะ Text input เห็นไหมคะ Text input น่ะค่ะ ตรง Text ของเด็ก ๆ ต้องเป็น Empty เป็นหรือเปล่าคะ ให้กลับมาที่หน้า Design ก่อนได้หรือเปล่า มาเช็กไอ้สิ่งที่อยู่ใน text input มันต้องเป็นช่องว่างนะ ไม่มีอะไรอยู่น่ะ กดเครื่องหมายกากบาท มันก็จะขึ้น Empty String แทน มันก็จะขึ้น Empty จะขึ้น Mpty ให้มันขึ้น Imty string นะเด็ก ๆ ให้เลือก Dufult นะ ันขึ้น Imty string นะเด็ก ๆ ให้เลือก Dufult นะ โอเคไหม ค่า 2 ตัวนี้ ดูที่ค่า 2 ตัวนี้ดูที่ค่า 2 ตัวนี้ ค่า Text มันต้องเป็น Empty ค่าของ... ก็คือให้มันเซ็ต เซ็ตเป็นเเริ่มใหม่เสมอน่ะนะ นะคะ เหมือนกันนะคะ ทั้ง 2 อัน เพราะฉะนั้น อย่าลืมเช็กที่ Login ค่ามันต้องเหมือนกันทั้งสองนะคะ เช็กให้เหมือนกันด้วย โอเคนะ ต้องเช็กทั้ง 2 อันด้วย ลืม ๆ ลืมให้เช็กขอโทษทีนะคะ อย่างนั้นมา Coding ต่อได้นะคะ ไปที่บล็อกเราเหมือนเดิมนะ ตอนนี้ก็คือใส่แล้วนะ เด็ก ๆ จะต้องมี 1. ประกาศตัวแปร 2 อัน มีแล้วใช่ไหมคะ คือ 2 อันนี้ถูกต้องไหม มีอันที่ 2 ก็คือมี... มีการควบคุมปุ่ม ปุ่ม Sign in ใช่ไหม บอกไว้ว่าเมื่อเรากดปุ่ม Sign in นี่ ให้มันไปไหน ถ้ากดปุ่ม Sign in ปุ๊บ มันจะต้องไปที่อะไรคะ หน้า Login ก็คือไป Scene ที่ 2 ไป Scene ที่ใช่ไหมคะ ไปหน้าที่ 2 แล้วทีนี้สิ่งที่จะเกิดขึ้นในตัวนี้เมื่อเรากำหนดให้ค่าตัวแปร User นี่เก็บอะไร เห็นไหมคะ เก็บ Text ที่เรากรอกเข้าไปน่ะค่ะ เก็บ Text ไว้ด้วยนะคะ เก็บ Text ของ Username กับของ Password นะคะ หน้า Login มีเท่านี้เอ้ยพูดผิด หน้า Sign in มีเท่านี้ ไปที่หน้า login บ้าง ทีนี้ไปที่หน้า login นะคะ เหมือนเดิมเลย เลือกปุ่มกดก่อนเพื่อจะให้มันขึ้น ส่วนนี้ขึ้นมา เด็ก ๆ ไปเลือกตัวนี้นะ ต้องมาอยู่ที่ Screen login นะลูก ให้เช็กด้วย ตอนนี้เราจะต้องอยู่ที่หน้าที่ 2 นะ โอเคไหม จะเขียน Box ช่องที่ 2 ตัวแรกที่เด็ก ๆ ต้องเลือก คือ Button ปุ่ม login ตัวเอง อยู่ไหน ตั้งชื่อว่าอะไร ดูนะคะ ให้ดูว่าไอ้ปุ่มนี้ ตัวเองนี่ พอมีสีแดงขึ้นนี่มันจะมี ตัวนี้ขึ้นมาให้เห็นว่าปุ่มของเราชื่อนี้ นึกออกนะ นะคะ เพราะฉะนั้น คลิกที่ปุ่ม 1 ครั้ง เลือกตัวแรกเลย เห็นไหมคะ When button login click เลือกออมาวาง เห็นไหม เห็นไหม วางให้เห็นเหมือนกันเลย คลิกแล้วทำอะไรเงื่อนไข มีเงื่อนไข เพราะอะไร เพราะมันต้องไปตรวจก่อน ว่าไอ้ Text ที่ป้อนเข้ามาใช่ไหม Text Username Text Password น่ะ มันถูกไหม เงื่อนไข if ถ้า if ก็คือต้องเป็น Logic เด็ก ๆ ต้องไปที่ Logic หรือตรรกะนะคะ ไอ้ตัวนั้น เดี๋ยวก่อน ต้องมาที่ Control ก่อน ควบคุมก่อน เพื่อมาเลือก if ใช่ไหมคะ if do ใช่ไหม ลาก if กับ do นะคะ มาต่อตรงนี้ ได้อย่างนี้เห็นไหม ตอนนี้ได้ 2 block หรือยัง ใบเตยทันไหม ทันนะ เพราะเราต้องกำหนดเงื่อนไขว่าถ้า Text input นะคะ username เข้ามาปุ๊บนี่นะคะ มันจะมีค่าเท่ากับอะไร เราจะต้องเอามันไปเก็บไว้ในตัวแปรของ Cloud ที่เราเก็บตัวที่ชื่อว่า user นะ ตัวนี้มาอย่างไร ตัวนี้มาได้จากเห็นไหมคะ ค่าเรื่องหมายเท่ากับนี่ เด็ก ๆ ต้องไปเลือก Logic ก่อนค่ะ เห็นไหมคะ ตัวแรกเลย คลิกเครื่องหมายเด็ก ๆ ต้องใส่ตัวนี้เข้าไปก่อน ดูนะ ต้องเอา Logic เข้ามาใส่ก่อนะคะ กับตรงนี้ เห็นไหม มันจะมีบล็อกอะไรที่เราเอามาใส่ Block ของ Text input ของเรา เห็นไหม Text input username text เห็นไหมคะ คลิกชื่อ Text input เสียก่อน Text input ตัวแรกก่อนนะ ตัวนี้มันถึงจะขึ้น ถ้าไม่คลิกไอ้นี่ ไม่มีน่ะค่ะ ไม่ขึ้นนะคะ เด็ก ๆ ต้องคลิกที่ชื่อ ที่ Component มันก่อน 1 ครั้ง แล้วค่อยมาเลือก text ใส่เข้าไปในช่องนี้นะ ไม่ใช่อันที่ 2 ไม่ใช่อันนี้ ใส่อันแรกนี่ เห็นหรือเปล่า ใส่แบบนี้ เห็นไหมคะ Text input username text ถ้า Text input username ที่เรากรอกเข้ามานี่ เท่ากับ เท่ากับตัวแปรที่เราเก็บไว้เห็นไหมคะ มันเป็นตัวแปรเด็ก ๆ ต้องไปเปิดอะไรคะ Variable ใช่ไหมคะ ไปเอาตัวแปรของ Cloud Variable เรามาใส่ เห็นไหม เห็นไหมคะ อันนี้ก็คือเมื่อป้อน ป้อน Username ใช่ไหม เมื่อป้อน Username มันต้องมาตรวจว่า username นี่ตรงกับใน Cloud username ที่เก็บข้อมูล Username ไหม ถ้ามันตรง เห็นไหมคะ ถ้ามันตรงปุ๊บ เราจะคลิกที่ให้มันไปที่ Navigation Tool เมื่อกดปุ่ม login มันต้องไปที่หน้า Screen my app ก็คือมันต้องไปโผล่หน้านี้ ต้องไปเปิดหน้านี้ขึ้นมา ก็คือพอกดปุ่มนี้ปุ๊บ มันจะมาเข้ากดปุ่ม Login ปุ๊บมันจะเข้ามาหน้า Scene หน้า my app ทันทีนะคะ ก็คือถ้าถูกต้อง อันนี้ให้เช็กแค่ Box แรกยังไม่หมดใช่ไหม else if มาอย่างไร เด็ก ๆ ตัวนี้ ใบเตยใจเย็น ๆ นะ ดูวิธีคลิกดี ๆ มันมีความซับซ้อนนิดหนึ่ง คือ คือมันไม่ใช่คลิกแล้วมันขึ้นนะคะ เห็นไหม คลิกอย่างไรให้ไอ้นี่มันโผล่มานี่ คลิกอย่างไร กดที่ตัวเครื่องหมายฟันเฟือง 1 ครั้ง ได้ไหม ใครมีไอ้นี่ขึ้น ใครคลิกไม่ขึ้น ใบเตยขึ้นไหมลูก ไม่ขึ้น ดูดี ๆ นะ วิธีกด กดตรงฟันเฟืองใช่ไหม เลื่อนไปที่ฟันเฟืองก่อนแล้วกดเมาส์ คลิก คลิกข้างไว้นิดหนึ่ง แล้วก็ปล่อย มันจะขึ้นมานะคะ เลือกอะไรคะ else if ค่ะ else if ใส่ต่อจาก Do นะ เห็นไหม เอามาต่อตรงนี้นะลูก ต้องเอามาต่อตรงข้างล่างมัน เห็นหรือเปล่า เราก็จะได้ elf if do อย่างนี้เห็นไหม แล้วมีอะไรต่ออีก มี else ต่ออีก ทำเหมือนเดิม เลือก else ต่อจาก else if เราจะได้ elseif 1 อัน แล้วก็ else do แล้วก็ el 1 อัน do else if do ลืมลบอันนี้ออก ไม่เป็นไร ส่งมาแล้วก็แล้วไป สิ่งที่จะต้องทำต่อมา เมื่อกี้เราแค่คลิกที่ text user มันยังเหลือ Password อีกนะ ทำเหมือนเดิมค่ะ ตรง elseif ไปเลือก Logic เท่ากับมา ให้เด็ก ๆ เลือก Logic แล้วคลิกที่มีเครื่องหมายเท่ากับ ลากออกมาวาง ลากออกมาเหมือนเดิม ต้องเอาตัวนี้วางก่อน ถ้าเอา Text นี้วาง เห็นไหมไอ้ Text นี้มันอยู่เพราะฉะนั้น เราต้องเอา Logic มาวางค่ะ แล้วก็เหมือนเดิมค่ะ คลิกที่ปุ่ม Text password Text ที่เราจะใส่ Password แล้วก็ไปเลือก Text in put passwordมาวาง วางใน Block อันแรกนะคะ ไม่เข้า สังเกต ถ้ามันขึ้นเหลืองนี่ ต่อได้ อย่างนี้ เห็นไหมคะ เวลาดูเวลาเอา Block มาใส่นะคะ สิ่งที่ต่อจากอันนี้คืออะไร ก็คืออะไร อันนี้ cloud variable user ตัวแปรที่ชื่อว่า Password ใช่ไหมคะ ตัวที่ 2 เพราะฉะนั้น ไปหาตัวแปรที่ชื่อว่า Password มาใส่เข้าไป อยู่ตรงไหนเอ่ย ไปที่ Variable แล้วก็เลือก Cloud Variable Password เสียบลงไป มา ๆ ๆ เห็นไหมคะ ถ้าชื่อตรง ตรงกับใน cloud Do ไปทำอะไร ก็เลือก Navigation Tool Control ก็ให้มันไปที่หน้า my app ใช่ไหม ถ้า login ถูกน่ะ ชื่อก็ถูก นามสกุลก็ถูกนี่ มันจะต้องไปหน้าที่ 3 แต่ทีนี้ ถ้าใส่เข้าไปแล้วไม่ถูกล่ะ ใช่ไหม ตรง else นะคะ จำได้นะคะ Label ที่อยู่ตรงนี้ เราจะให้มันแสดงข้อความที่บอกน่ะค่ะ ว่าถ้าเมื่อที่ใส่ username password ไม่ถูกต้อง มันจะขึ้นมาเตือนว่า คุณใส่ username กับ password ไม่ถูกนะคะ เพราะฉะนั้น ตัวนี้นะคะ ให้เด็ก ๆ คลิกที่ label ค่ะ label ที่เราจะใช้ เห็นไหม แล้วก็เลือกอันแรกเลย Set Label text to เอามาวาง เห็นไหมคะ ก็คือกำหนดให้ label text นี่ แสดงข้อความว่า มันพิมพ์ภาษาไทยไม่ได้ก็เอาภาษาอังกฤษไปก่อนนะคะ Your Y-o-u-r Your Username User แล้ว password ของคุณไม่ถูกต้องนั่นเองนะคะ อันนี้เป็นตัวUsername ไม่ใช่ตัวแปรนะคะ สังเกตสีบล็อกเป็นสีชมพู นั่นแสดงข้อความที่อยู่ในบล็อกสีชมพูนี้นะคะ Your username และ and และ password p-a-s-s-w-o-r-d password is ใช้คำว่า "is" ไม่ถูกต้อง เป็นอยู่คือ is am are นะคะ if in corect in c-o-r-e-c-t ก็คือชื่อ username ของคุณ ไม่ใช้ and Username or or นะคะ คือ มันน่าจะผิดตัวใดตัวหนึ่ง or password is in correctรู้ว่าตัวนี้มันไม่ถูกนะ เห็นไหมคะ เสร็จแล้ว อันนี้ไม่ต้องมี แถมมา น่าจะตอนลองแล้วลืมเอาอก เมื่อวานลองทำแล้วลืมเอาออกนะคะ ทำคืออะไร เราจะต้อง Test Test โดยการกดปุ่มอะไรคะ เด็ก ๆ โค้ดครบแล้วนะคะ กดที่ปุ่ม play เอ้ย Web preview ให้คลิกที่หน้า Sign in ก่อนนะเด็ก ๆ แล้วลองป้อนข้อมูลลงไป ป้อน username ป้อนและจำด้วยนะ เพราะเดี๋ยวมันให้กรอกซ้ำ เดี๋ยวจะป้อนให้ดูนะคะ เช่น Test จะใช้ user ว่า Test t-e-s-t test Password เอา 001100 Password จะคือ 001100 กด Sign in ปุ๊บ มันจะต้องไปที่หน้าที่เท่าไรคะ หน้า login นะคะ พอกดนี่ มันต้องไปหน้าที่ 2 ดูนะคะ โผล่มาหน้า login โผล่มาหน้า login ลองใส่ Test ใช่ไหม ที่เราใส่ไปเมื่อกี้ แล้วก็อะไรนะ 001100 แล้วกด login ถูกต้องเห็นไหมคะ แสดงว่าที่เช็ก login น่ะถูกต้อง เดี๋ยวเช็กให้ดูว่าแล้วถ้าใช้ login ไม่ถูกล่ะ ดูนะคะ อยู่หน้า login ดูนะคะ อยู่หน้า Login username มั่ว ๆ password ก็พิมพ์มั่ว ๆ แล้วกด login เห็นไหม ถ้าไม่ถูกมันจะขึ้นข้อความบอกว่า Your username or password is in correct ความจริงต้องให้มันเคลียร์ด้วยนะ ไม่มันเคลียร์ พอขึ้นอันนี้เสร็จแล้วก็เคลียร์หน้าจอ แล้วก็ไอ้นี่ใหม่นะคะ แล้วก็ Login ใหม่ แล้วกดใหม่ พอคลิกใหม่ เปลี่ยนเป็น tttt แล้วพอคลิก Test ใหม่นะคะ T-e-s-t Test 001100 กด login มันจะต้องเข้าหน้าที่ 3 นั่น ใคร Test แล้วไม่ผ่าน ยกมือ พี่เซฟต้องเช็กที่ปุ่มถูกไหม คลิกที่... เพราะเช็กไปทีละอันนะ อันแรกใช่ไหมคะ ดูที่ Block ของเรานะคะ ชื่อว่าปุ่มอะไรพี่เซฟ เมื่อมีการคลิกปุ๊บ มันจะต้องไปที่หน้า login ใช่ไหมคะ ถ้าถูกต้อง โดยมีเงื่อนไขว่าตัวแปรชื่อตัวแปร Name นี่ จะถูกเอาไปเก็บไว้ใน Cound ใช่ไหม ตัวที่ 2 ตัวที่ 2 ไม่ถูก ดู ปุ่มต้องเป็น Button login ใช่ไหมคะ คลิกเข้าไปทำอะไร เมื่อมีการคลิกที่ปุ่มนี้ สิ่งที่มันจะต้องทำ ก็คือมันจะต้องไปเช็กก่อนว่า username ถูกไหม ตรงกับที่กรอกเข้าไปใน Sign in ไหม ถ้าตรงมันต้องไปที่ Sreen My App เห็นไหมคะ เงื่อนไขมันต้องตรงทั้ง 2 ต้องไปที่ My app ทั้ง 2 เห็นไหม พี่มีไปที่หน้านี้หรือเปล่า บางคน ก็คือพอคลิก Sign in แล้วมันไปหน้า Login แต่มันไปหน้า login แต่มันไม่เก็บใช่ไหม อันดับแรกดูตัวแปรนะ ตัวแปรที่เราใช้ คือ user กับ password อันดับที่ 2 ก็คือ ตรงนี้นะ เราต้องเลือกเอามาจากปุ่มใช่ไหมคะ when button click ปุ๊บ ให้ไปที่หน้าที่ 2 ก็คือหน้านี้ ตรงนี้เช็กสิ เช็กก่อน ว่าเมื่อคลิกปุ่ม Sign in นี่ มันจะต้องให้มันไปที่หน้าที่ 2 นั่น ผิดตรงไหน เจอตรงไหน ใช่ไหม เพราะฉะนั้นต้องไล่ดี ๆ เห็นไหม ค่อย ๆ ไล่นะคะ นะคะ ถ้า Logic ผิดน่ะ มันก็จะไม่เช็กนะ พอในหน้าที่ 2 นี่ เอ้ยในหน้าที่ 1 เราต้องมาดูในหน้าที่ 2 นะ เมื่อเรากดปุ่ม login นี่ สิ่งที่จะต้องเกิด ก็คือชื่อที่ป้อนเข้ามา จะต้องตรงกับใน Cloud นี่เห็นไหมคะ ถ้าจะผิดมันก็จะผิดตรงช่วงนี้ ช่วงไอ้ตัวแปรนี่ล่ะ กับที่ที่จะให้มันไป ใครยังไม่ออก ยกมือ พงศ์พันธ์ ใครยังไม่ออกยกมือ โอเคนะคะ โดยปกติ ถ้าผิดนี้ให้สังเกตที่ เด็ก ๆ ดูดี ๆ นะ เมื่อกี้ไอซ์ให้ความคิดเห็นมาว่า บางครั้ง พอคลิกเข้าไปนี่ ให้ดูด้วย เหมือนสีที่แม่ใส่มานี่ แม่ขึ้นสีเขียวแต่ของเด็ก ๆ แสดงว่าเราอาจจะเลือกตัวนี้มาไม่ถูก นี่มันเป็นสีตุ่น ๆ อย่างนี้ ใช้ไม่ได้นะนี่ พอขึ้นมันต้องเป็นสีของมันน่ะ สีของบล็อกมันน่ะ ต้องขึ้นลักษณะนี้ ถ้าขึ้นแบบนี้หมายถึงว่าเราใส่ Block ไม่ตรง ไม่ตรงล็อกมันนั่นเองนะคะ ก็มีผลเหมือนกันนะคะ ว่าทำให้มีผลเหมือนกันนะคะ ว่าทำให้เวลา Code แล้ว คือ คอมพิวเตอร์มันไปอ่าน มันไม่รู้ว่ามันคืออะไร นะ มันเป็นตัวไหน มันไปไม่ถูกว่าอย่างนั้นเถอะ ว่าอย่างนั้นเถอะ เหมือนดู มันเป็นโหว่ ๆ นี่ ความจริงมันเข้าล็อกแล้วนะคะ นี่ มันมีขามาต่อโผล่ขึ้นมา อย่างนี้เป็นต้น นี่ก็คือ การ Sign in แล้วก็ Login แล้วก็เข้าสู่หน้าถัดไป เหลืออะไรอีก ้าสู่หน้าถัดไป เหลืออะไรอีก ตอนนั้นแม่ยังแก้ให้ไม่ได้ใช่ไหม เอาไว้สัปดาห์หน้า อะไรนะ เมื่อ เมื่อ เราจะออกจากแอปนะ มันก็ต้องปิด ตอนนี้ทุกคน ก็คือเข้าหน้าที่ 1 เข้าหน้าที่ 2 เข้าหน้าที่ 3 ก็ได้ แต่เขาก็บอกว่า พอเวลาคนปิดน่ะ ไม่คลิกว่าต้องการออกจากแอป แล้วก็ปิดเลย นึกออกนะ มันก็เลยเหมือนไม่จำเป็นต้องมาเขียนโค้ดว่าเวลาจะออก ต้องการจะออกจากแอปหรือเปล่าอะไรอย่างนี้นะคะ เพราะเหมือนเหมือนเราใช้แอปของธนาคาร บางทีเราก็ไม่เคยไปกดปุ่มออกจากระบบอะไรเลย เพราะว่าพอเกิน 5 หรือ 10 นาที ธนาคารมันก็จะให้ออกจากระบบอยู่แล้วอะไรอย่างนี้นะคะ ไอ้ตัวนั้นมันก็ไม่มี เดี๋ยวจะลองดูก่อน ว่าถ้าเราต้องการให้มันมีทางออกแบบนี้นะคะ ก็คือพอกดปุ่ม End หรือจบโปรแกรมมันก็ควรจะปิดโปรแกรมไปเลยอะไรอย่างนี้นะคะ สัปดาห์หน้าอยากให้ทำแอปแบบไหน แม่ก็จะได้หาแนวมาพาทำเล่นต่อ เพราะ ABC เราก็ทำไปแล้วนะ ขาดอะไร เราขาดอะไร นำทางใช่ไหมคะ ใช่ไหม แบบนำทางนะ เดี๋ยวอาทิตย์หน้ามาลองทำเป็นแอปแบบนำทางดูนะคะ เดี๋ยวจะหา ค้นก่อน ยังไม่แน่ใจแอปแบบไหน จะได้แบบไหนมานะ โอเคค่ะ สำหรับสัปดาห์นี้ เราจะพอที่ทุกคนสามารถ Login เข้าไปได้ Sign in ได้ แล้วก็ Login ได้ แล้วก็เข้าสู่หน้าแอปของเราได้นะคะ สัปดาห์หน้าเดี๋ยวเราจะมาพาทำแอปที่... ว่าอย่างไรครับ รอแป๊บหนึ่งครับ ขอบคุณพี่ล่ามนะคะ สำหรับรอบบ่ายวันนี้ ขอบคุณค่ะ [สิ้นสุดการถอดความ]