by Frevation | Aug 26, 2022 | blog, react-native
เวลาเราทำ web app เราคงสามารถหา dataURI ได้ไม่ยาก แต่ถ้าเป็น mobile app ล่ะ โดยบทความนี้เราจะแนะนำ library นึงที่ใช้หา dataURI ได้ไม่ยากเลย เรามาเริ่มใช้งานเลยโดยผมจะเขียนแอปมาให้คร่าวๆ โดยสมมุติว่า รูปตรา sample เป็นสิ่งที่เราอยากหา DataURI ส่วน ปุ่ม press me...
by Frevation | Jul 8, 2022 | blog, react-native
คุณอาจจะเคยเห็น Chip บน Gmail หรือแอปอื่นๆ ทีนี้เราจะมาลองทำแบบนั้นบ้าง โดยเราจะทำแบบในรูป บน TextInput ผมจะใช้ onBlur เพื่อให้สามารถแบ่ง chip ของแต่ละชื่อได้ หรือเวลาเรากด confirm ก็จะทำงานเช่นกัน ต่อไปจะเป็น Chip โดยใส่ title เป็นชื่อ และสร้างไอคอนที่กดแล้วลบได้ด้วย...
by Frevation | May 13, 2022 | blog, react-native
หากใครเคยใช้ picker บน react native อาจจะเคยพบปัญหาที่ว่า เราอยากให้มีปุ่มแถมขึ้นมา เช่น กรุณาเลือก แบบนี้ หากเราไม่ใส่ option มาเลย จะเป็นแบบด้านล่าง จะเห็นว่า picker จะดึงเอา option แรกสุดมาใส่ แต่สิ่งที่เราต้องการคือแบบนี้ ปัญหาก็คือว่า...
by Frevation | May 6, 2022 | blog, react-native
หากเราเคยใช้ vector icon จะรู้ว่าเวลาเราจะเรียกไอคอนของ type อื่น เราต้องทำการ import มาใหม่ทุกครั้ง ทีนี้เราจะมาใช้ Icon จาก react-native-elements กัน รายการด้านล่างคือ type ที่ Icon นี้สามารถใช้งานได้ ทีนี้เราจะมาใช้กัน ทำการ import Icon เข้ามา (อย่าลืม install...
by Frevation | Apr 29, 2022 | blog, react-native
FAB เป็นปุ่มที่ลอยอยู่บนสุดของจอเรา หลายแอปก็ใช้กันเพื่อความสวยงาม ทีนี้เราจะมาดูกันว่าปุ่มนี้มันเขียนยังไงโดยที่เราไม่ต้องลง library อะไรเพิ่มเลย เราจะใช้อยู่ 2 component หลักๆ ก็คือ Text กับ TouchableOpacity ส่วน stylesheet ใช้เพื่อที่จะได้ไม่ต้องเขียน inline-style...
