22 January 2015

รู้จักการใช้งาน Android Studio แบบพื้นฐาน - ตอนที่ 2

Updated on


        ต่อจากบทความแรกนะครับ เนื่องจากเนื้อหายาวเหยียดเกินไป (โดยเฉพาะภาพ) จึงขอแยกบทความไว้ดีกว่าเพื่อไม่ให้แต่ละบทความต้องดาวน์โหลดเยอะเกินจำเป็น

        ซึ่งตอนที่ 2 นี้ก็เป็นการอธิบายเกี่ยวกับหน้าต่างในโปรแกรม Android Studio หลังจากสร้างโปรเจคขึ้นมาใหม่หรือว่าเอาของเก่ามาเปิดนะครับ

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


        โดยตำแหน่งของ Tool เหล่านี้สามารถอยู่ชิดมุมของ Workspace ได้ทั้งหมด 8 แบบ

        1. ชิดบนฝั่งซ้ายและขวา
        2. ฃิดล่างฝั่งซ้ายและขวา
        3. ชิดขวาฝั่งบนและล่าง
        4. ชิดซ้ายฝั่งบนและล่าง

        ซึ่งเครื่องมือเหล่านี้จะช่วยอำนวยความสะดวกในการพัฒนาแอพฯ ซึ่งมือใหม่อาจจะได้ใช้แค่บางอันเท่านั้น

        และถ้าเครื่องมือเหล่านี้มีบางตัวหายไปเพราะเผลอไปปิดหรือยังไม่ได้เปิด ก็สามารถเข้าไปเลือกแสดงเครื่องมือได้ที่ View > Tool Windows จะมีเครื่องมือต่างๆให้เลือก



        หรือจะเปิดโดยคลิกขวาที่ปุ่มมุมซ้ายล่างของโปรแกรม Android Studio ก็ได้เช่นกัน



        โดยเครื่องมือแต่ละตัวทำหน้าที่ต่างกันออกไปดังนี้


Message 

        เป็นหน้าต่างแสดงข้อความที่มาจากการทำงานของ Gradle ในเวลาที่สั่งให้ Build Gradle



        ในกรณีที่ Gradle มีข้อผิดพลาดก็จะแสดงให้เห็นในนี้เช่นกัน



Project 

        หน้าต่างแสดงไฟล์ข้อมูลที่อยู่ในโปรเจค



        สามารถปรับเปลี่ยนรูปแบบการแสดงผลของโปรเจคได้ด้วยการกดที่ปุ่มมุมซ้ายบนของหน้าต่าง


        Android เป็นรูปแบบการแสดงโปรเจคของแอนดรอยด์โดยเฉพาะ โดยจะแสดงข้อมูลในโปรเจคแยกออกมาเป็นสัดส่วน และจะแสดงเฉพาะไฟล์สำคัญๆเท่านั้น เช่น Java Source, Resource, Asset, Manifest หรือ Gradle เป็นต้น (ดูภาพประกอบข้างบน)

        Project เป็นรูปแบบการแสดงโปรเจคโดยอิงไฟล์ข้อมูลตาม Path ที่อยู่ในเครื่องจริงๆ



        Package แสดงเฉพาะโฟลเดอร์ที่เป็น Package เท่านั้น (มีวงกลมสีฟ้าอยู่ในรูปโฟลเดอร์)



        Project File แสดงตามโฟลเดอร์ที่เป็น Project และ Module เท่านั้น (มีสี่เหลียมสีฟ้าอยู่มุมขวาล่างของโฟลเดอร์)



        Problems แสดงเฉพาะไฟล์ที่มี Syntax Error หรือโค๊ดโปรแกรมในไฟล์นั้นๆไม่ถูกต้อง



        Production แสดงเฉพาะไฟล์ที่เป็น Production เท่านั้น จะไม่แสดงไฟล์ที่เป็นส่วนของ Test



        Tests แสดงเฉพาะไฟล์ที่อยู่ในส่วนของ Testing เท่านั้น



        ซึ่งการเลือกรูปแบบการแสดงไฟล์จะช่วยให้ผู้ที่หลงเข้ามาอ่านสามารถจัดการไฟล์ได้สะดวกขึ้น ตัดไฟล์ที่ไม่จำเป็นออกไป แล้วโฟกัสไปที่ไฟล์หลักๆ


Favourites 

        เป็นหน้าต่างที่ช่วยให้สามารถดู Favorite, Bookmarks และ Breakpoints ที่สร้างไว้ทั้งหมดในโปรเจค


        Breakpoints จะมีอยู่ด้วยกันหลักๆ 3 แบบ โดยจะมีสัญลักษณ์แตกต่างกันออกไปดังนี้

        • Method Breakpoints สร้าง Breakpoints ที่ Method ใดๆ โดยจะมีสัญลักษณ์สี่เหลี่ยมอยู่ที่มุมทั้ง 4
        • Temporary Line Breakpoints สร้าง Breakpoints ชั่วคราวสำหรับบรรทัดใดๆ โดยจะมีหมายเลขแสดงอยู่
        • Line Breakpoints สร้าง Breakpoints สำหรับบรรทัดใดๆ



        การเพิ่ม Breakpoints สามารถเพิ่มได้ด้วยการเลือกบรรทัดที่ต้องการแล้วเลือกไปที่

        • Run > Toggle Line Breakpoints สำหรับ Line Breakpoints
        • Run > Toggle Temporary Line Breakpoints สำหรับ Temporary Line Breakpoints
        • Run > Toggle Method Breakpoints สำหรับ Method Breakpoints



        และสามารถเพิ่ม Line Breakpoints และ Method Breakpoints อีกวิธีแบบง่ายๆด้วยการคลิกแถบซ้ายมือของหน้าต่างโค๊ด (ตำแหน่งที่แสดง Breakpoints นั่นเอง)



        Bookmarks ใช้สำหรับ Memo ตำแหน่งโค๊ดที่ต้องการ แต่ไม่ต้องการกำหนดเป็น Breakpoints สามารถสร้างได้ง่ายๆด้วยการเลือกบรรทัดที่ต้องการ Bookmark แล้วเลือกไปที่

        • Navigate > Bookmarks > Toggle Bookmark สำหรับการ Bookmark แบบปกติ โดยจะมีสัญลักษณ์เป็นเครื่องหมายถูกสีขาว
        • Navigator > Bookmarks > Toggle Bookmark with Minemonic สำหรับการ Bookmark โดยกำหนดสัญลักษณ์ตัวอักษรให้กับ Bookmark นั้นๆด้วย




        สำหรับ Bookmark with Minemonic จะสามารถกำหนดสัญลักษณ์ตัวอักษรที่ต้องการได้ด้วย โดยจะมีหน้าต่างเล็กๆแสดงขึ้นมาให้เลือก



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



        แล้วตั้งชื่อ Favorite ได้ตามใจชอบ



        เมื่อต้องการเพิ่มไฟล์เข้าไปอยู่ใน Favorite ใดๆให้เลือกไฟล์ที่ต้องการแล้วเลือกไปที่ File > Add to Favorite แล้วเลือก Favorite ที่ต้องการเพิ่ม



        หรือจะให้ง่ายกว่านั้นก็คลิกขวาที่ไฟล์นั้นๆซะเลย แล้วเลือก Add to Favorite แล้วเลือก Favorite ที่ต้องการเพิ่ม



        ไฟล์ที่เพิ่มลงไปเมื่อครู่ก็จะแสดงอยู่ใน Favorite ที่ได้สร้างขึ้นมา



Run

        หน้าต่างสำหรับแสดงข้อความจากการทำงานของ ADB เมื่อทำการติดตั้งแอพฯลงในอุปกรณ์แอนดรอยด์



Debug

        หน้าต่างสำหรับแสดงการทำงานเมื่อทำการ Debug โดยจะมีหน้าต่างย่อยอยู่ในนี้ด้วยกัน 3 หน้าต่าง

        Debugger สำหรับแสดงผลการ Debug ในแต่ละ Breakpoints



        Console สำหรับแสดงการทำงานของ ADB



        Logcat สำหรับแสดง Log ที่เกิดจากแอพฯ



        สำหรับเครื่องมือ Debug เจ้าของบล็อกขอข้ามไปดีกว่าเนื่องจากไม่ได้ใช้มากนัก และน่าจะทำเป็นบทความแยกแทน


Android

        เครื่องมือตัวนี้แท้จริงแล้วมันก็คือ Dalvik Debug Monitor Server หรือ DDMS นั่นเอง โดยจะมีหน้าต่างที่อิงมาจาก DDMS เยอะแยะมากมาย โดยเฉพาะ LogCat



        และอีกหน้าต่างจะเป็น Log การทำงานของ ADB เท่านั้น



        สำหรับแถบเมนูที่อยู่ทางซ้ายมือจะประกอบไปด้วย



        Screen Capture บันทึกภาพหน้าจอเป็นไฟล์ภาพนิ่ง
        Screen Record บันทึกภาพหน้าจอเป็นแบบวีดีโอ
        System Information Dump ข้อมูลของตัวเครื่อง ณ ตอนนั้นๆออกมาแสดงเป็น .txt



        Terminate Application ปิดแอพฯที่รันทดสอบอยู่
        Initiate GB สั่งให้ Garbage Collection ทำงาน
        Dump Java Heap Dump ข้อมูล Heap ใน Java ออกมาเป็นไฟล์ .hprof
        Start Method Tracing เก็บข้อมูลการทำงานของ Method ต่างๆภายในแอพฯ (จนกว่าจะกดปุ่มนี้อีกครั้ง)



        Start Allocation Tracing เก็บบันทึกการใช้พื้นที่หน่วยความจำโปรแกรมทั้งหมดในแอพ (จนกว่าจะกดปุ่มนี้อีกครั้ง)


        ส่วนของ LogCat เดี๋ยวเจ้าของบล็อกขออธิบายแยกบทความอีกที


Structure 

       หน้าต่างแสดงโครงสร้างของไฟล์นั้นๆว่ามีคลาสอะไร มีเมธอดอะไรหรือตัวแปรอะไรบ้าง ซึ่งสะดวกมากเวลาที่เขียนงานใหญ่ๆซักตัว




Changes 

        หน้าต่างสำหรับจัดการ Local Repositories โดยเฉพาะ มีการแสดงไฟล์ที่มีการแก้ไขและไฟล์ที่เพิ่มเข้ามาใหม่ โดยเครื่องมือนี้จะสามารถใช้งานได้เมื่อโปรเจคนั้นๆมีการใช้ Version Control อยู่



        และก็มีแถบเมนูที่จะเข้ามาช่วยให้อำนวยความสะดวกมากขึ้นอีก



        Refresh เป็นการสั่งให้ Version Control ทำการ Refresh
        Commit Changes ทำการ Commit ไฟล์ขึ้น Remote Repositories



        Revert ทำการย้อนโค๊ดในไฟล์นั้นๆกลับไปยัง Commit ล่าสุด



        New Changelist สร้าง Changelist ขึ้นมาเอง โดยสามารถกำหนดชื่อได้ตามใจชอบ



        เมื่อต้องการย้ายไฟล์ไปที่ Changelist นั้นๆให้คลิกขวาที่ไฟล์ที่ต้องการแล้วเลือก Move to Another Changelist



        เลือก Changelist ที่ต้องการย้าย



        ไฟล์นั้นๆก็จะถูกย้ายไปอยู่ใน Changelist ที่ต้องการแล้ว



        Delete Changelist ลบ Changelist ที่เลือก
        Set Active Changelist กำหนดให้ Changelist ที่เลือกเป็น Active
        Move to Another Changelist ย้ายไฟล์นั้นๆไปยัง Changelist ที่ต้องการ (อธิบายไปแล้ว)
        Show Diff แสดงการเปลี่ยนแปลงของโค๊ดโดยเทียบกับ Commit ล่าสุดของไฟล์นั้นๆ



   Expand All ขยาย Changelist เพื่อแสดงไฟล์ที่อยู่ในนั้นทั้งหมด



        Collapse All ย่อ Changelist ทั้งหมด



        Group by Directory แสดงไฟล์ตาม Directory (ในกรณีที่ไม่เลือก จะแสดงตาม Changelist)



        Copy ก๊อปไฟล์ที่เลือก
        Show Ignored Files แสดงไฟล์ที่ไม่ได้รวมอยู่ใน Repositories



        Configure Ignored Files ตั้งค่าว่าจะให้ไฟล์ใดบ้างไม่รวมอยู่ใน Repositories



        Preview Diff แสดงตัวอย่างของโค๊ดที่ถูกแก้ไขโดยเทียบกับ Commit ล่าสุด (แนะนำให้ Show Diff ไปเลย ดูง่ายกว่า)



         Help เปิดหน้าเว็ปของ IntelliJ IDEA เพื่ออธิบายหน้าต่าง Changes


Application Servers

        เครื่องมือนี้ไม่ได้ใช้นะครับ ดังนั้นจึงขอข้ามไปเลย


Build Variants

        หน้าต่างกำหนดการ Build Project ว่าจะ Build ในรูปแบบใด เนื่องจาก Android Studio สามารถ Build ได้หลายๆแบบตามที่กำหนดคำสั่งไว้ใน build.gradle ซึ่่งโดยพื้นฐานจะมี 2 แบบ คือ debug กับ release (debug สำหรับทดสอบ ส่วน release สำหรับ Production)



Commander

        หน้าต่างแสดงโปรเจคและโครงสร้างของโคีด จะคล้ายคลึงกับหน้าต่าง Project และ Structure ผสมกัน แต่ว่า Commander จะแบ่งหน้าต่างเป็นสองฝั่ง สามารถเปิดไฟล์ที่อยู่ในโปรเจคแยกกันได้ และสามารถดูโครงสร้างคำสั่งในไฟล์นั้นๆได้ทันที และเมื่อคลิกเลือกที่ไฟล์ใดๆก็จะเป็นการเปิดไฟล์ในทันที



Designer

        เครื่องมือนี้ไม่ได้ใช้นะครับ ดังนั้นจึงขอข้ามไปเลย


Documentation

        หน้าต่างแสดงรายละเอียดของคำสั่งนั้นๆ ซึ่งปกติจะไม่มีให้เลือก แต่สามารถเปิดได้ด้วยการกด Ctrl + Shift + Space bar เมื่อเลือกที่คำสั่งนั้นๆ ก็จะมีหน้าต่างแสดงรายละเอียดของคำสั่งขึ้นมา



        กดปุ่มรูปหมุดที่อยู่มุมขวาบนเพื่อให้หน้าต่าง Documentation อยู่ที่แถบเครื่องมือ


        ทีนี้จะมีแถบ Documentation อยู่ที่แถบเครื่องมือแล้วก็จริง แต่หน้าต่างแสดงรายละเอียดยังลอยอยู่ ให้กดที่ปุ่มรูปเฟืองที่อยู่มุมขวาบนแล้วเลือกที่ Float Mode เพื่อเอาเครื่องหมายถูกต้องออกซะ (ปิด Floating Mode)



        เพียงเท่านี้ก็จะได้หน้าต่าง Documentation ที่แถบเครื่องมือแล้ว



        ถ้าไม่ชอบ และอยากกลับไปใช้แบบเก่า สามารถกดที่ปุ่มรูปกากบาทสีแดงในหน้าต่าง Documentation ได้เลย เพียงเท่านี้ก็จะกลับไปแสดงแบบเดิมแล้ว



Event Logs

        หน้าต่างแสดง Log ของเหตุการณ์ต่างๆที่เกิดขึ้นใน Android Studio



Gradle

        หน้าต่างคำสั่ง Gradle โดยจะมีรายชื่อคำสั่งของ Gradle ให้เลือกเพื่อให้คำสั่งทำงานกับโปรเจคนั้นๆ



Gradle Console

        หน้าต่างแสดง Log การทำงานของ Gradle


     ในกรณีที่ Build Gradle แล้วมีข้อผิดพลาดเกิดขึ้น จะสามารถรู้ได้ที่หน้าต่างนี้


Terminal

        หน้าต่างสำหรับพิมพ์ Command Line (เหมือน CMD นั่นเอง) ทำให้สามารถเรียกใช้งาน Command Line ได้ตามใจชอบ



TODO

        หน้าต่างแสดง TODO Comment ทั้งหมดที่มีในโปรเจคนั้นๆ ช่วยให้สามารถรู้ได้ว่าผู้ที่หลงเข้ามาอ่านได้ใส่ไว้ตรงไหนบ้าง เวลาที่มานั่งแก้ นั่งเพิ่มที่เคยคอมเม้นเก็บไว้ จะได้มาดูที่หน้าต่างนี้ได้เลยว่าเหลือตรงไหนอีก





Version Control

        หน้าต่างนี้ไม่ได้ใช้ ดังนั้นก็ขอข้ามไปนะครับ



        ในที่สุดก็ครบแล้วววววว....น้ำตาแทบจะไหล....

        ซึ่งจะเห็นว่า Android Studio นั้นยัดเครื่องมือมาให้เยอะมาก นี่แค่ส่วนหนึ่งเท่านั้นนะเนี่ย!!! ดังนั้นเจ้าของบล็อกก็จะทอดยาวไปเป็นบทความถัดไปแทนนะครับ เผื่อไม่ให้บทความนี้ยาวเกินจำเป็น และจะได้แยกเป็นหมวดหมู่ไปในตัวด้วย~