debug panel

สารบัญ

1. มันทำงานอย่างไร
2. การตั้งค่า
   1. โมดูลทั่วไป
   2. Android
   3. iOS
3. การใช้งาน
   1. ส่วนประกอบ
   2. คำอธิบายประกอบ
4. สถาปัตยกรรม
5. ใบอนุญาต
6. เกี่ยวกับ mirego

มันทำงานอย่างไร

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

• ที่เก็บข้อมูลที่พิมพ์
• กรณีการใช้งานที่มีฟังก์ชั่นพารามิเตอร์พิมพ์ที่สร้างรายการข้อมูลมุมมองรายการ
• ผู้แทนทรัพย์สินที่สามารถใช้โดยตรงในรหัสที่มีอยู่เพื่อลดแรงเสียดทานจากการอ่านค่าการดีบัก

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

การตั้งค่า

โมดูลทั่วไป

ห้องสมุดได้รับการเผยแพร่ไปยังที่เก็บ Maven สาธารณะของ Mirego ดังนั้นตรวจสอบให้แน่ใจว่าคุณมีมันรวมอยู่ในการตั้งค่าของคุณ gradle.kts dependencyResolutionManagement บล็อกการจัดการ

dependencyResolutionManagement {
    repositories {
        // ...
        maven( " https://s3.amazonaws.com/mirego-maven/public " )
    }
}

ในไฟล์ build.gradle.kts ระดับบนสุดของคุณเพิ่มการอ้างอิงไปยังปลั๊กอิน KSP:

plugins {
    // ...
    id( " com.google.devtools.ksp " ) version " 1.9.21-1.0.15 " apply false
}

ในไฟล์ build.gradle.kts ของโมดูลทั่วไปของคุณเพิ่มการอ้างอิงไปยังปลั๊กอิน KSP:

plugins {
    // ...
    id( " com.google.devtools.ksp " )
}

นอกจากนี้ยังเพิ่มการพึ่งพา core และ annotations พร้อมกับไดเรกทอรีแหล่งกำเนิด KSP ที่สร้างขึ้น:

 val commonMain by getting {
    dependencies {
        // ...
        api( " com.mirego.trikot:viewmodels-declarative-flow:x.y.z " )
        api( " com.mirego.debugpanel:core:x.y.z " )
        implementation( " com.mirego.debugpanel:annotations:x.y.z " )
    }
    kotlin.srcDir( " build/generated/ksp/metadata/commonMain/kotlin " )
}

อย่าลืมส่งออกการพึ่งพาหลักไปยังเฟรมเวิร์ก iOS:

kotlin {
    cocoapods {
        framework {
            // ...
            export( " com.mirego.trikot:viewmodels-declarative-flow:x.y.z " )
            export( " com.mirego.debugpanel:core:x.y.z " )
        }
    }
}

คุณต้องเพิ่มการอ้างอิงของคอมไพเลอร์ในบล็อกการพึ่งพา:

dependencies {
    add( " kspCommonMainMetadata " , " com.mirego.debugpanel:compiler:x.y.z " )
}

Android

ตัวอย่าง UI ได้รับการแก้ไขโดยอัตโนมัติจากโมดูลทั่วไปเนื่องจากเรารวมไลบรารีด้วยฟังก์ชัน api()

หากคุณมีปัญหาบางอย่างเกี่ยวกับไฟล์ META-INF/versions/9/previous-compilation-data.bin ในระหว่างการรวบรวมคุณสามารถเพิ่มลงในทรัพยากรที่ยกเว้นภายในไฟล์ build.gradle.kts ของแอป Android:

android {
    packaging {
        resources {
            excludes + = listOf (
                " META-INF/versions/9/previous-compilation-data.bin "
            )
        }
    }
}

iOS

หากคุณต้องการใช้ตัวอย่าง UI บน iOS ให้รวม POD ไว้ใน PodFile ของแอปพลิเคชัน:

 pod 'Trikot/viewmodels.declarative.SwiftUI.flow', :git => '[email protected]:mirego/trikot.git', :tag => 'x.y.z', :inhibit_warnings => true
pod 'DebugPanel', :git => '[email protected]:mirego/debug-panel.git', :tag => 'x.y.z', :inhibit_warnings => true

การใช้งาน

ในโมดูลทั่วไปของคุณสร้างคลาสด้วยคำอธิบายประกอบ @DebugPanel คุณสามารถค้นหาส่วนประกอบต่าง ๆ ที่มีอยู่ในตารางด้านล่าง

@DebugPanel(prefix = " MyProject " , packageName = " com.myproject.app.generated " )
data class DebugPanelConfig (
    val toggle : DebugPanelToggle ,
    val label : DebugPanelLabel ,
    val textField : DebugPanelTextField ,
    val button : DebugPanelButton ,
    val picker : DebugPanelPicker ,
    val datePicker : DebugPanelDatePicker ,
    val enumPicker : SomeEnum
)

เมื่อการกำหนดค่าเสร็จสิ้นคุณสามารถเรียกใช้งาน kspCommonMainMetadata Gradle เพื่อสร้างไฟล์เฉพาะสำหรับโครงการของคุณ
ตอนนี้คุณควรมี MyProjectDebugPanelUseCase.kt , MyProjectDebugPanelUseCaseImpl.kt , MyProjectDebugPanelRepository.kt และ MyProjectDebugPanelRepositoryImpl.kt ในคลาสของคุณ

สิ่งที่คุณต้องทำตอนนี้คือการสร้างอินสแตนซ์การใช้งาน:

 private val repository : MyProjectDebugPanelRepository = MyProjectDebugPanelRepositoryImpl ()
private val useCase : MyProjectDebugPanelUseCase = MyProjectDebugPanelUseCaseImpl (repository)

/* ... */

class ParentViewModelImpl (
    coroutineScope : CoroutineScope ,
    useCase : MyProjectDebugPanelUseCase
) : ParentViewModel, VMDViewModelImpl(coroutineScope) {
    override val debugPanel = DebugPanelViewModelImpl (
        coroutineScope,
        useCase,
        useCase.createViewData( /* Configure the components here */ )
    )
}

คุณสามารถควบคุมการมองเห็นของแต่ละองค์ประกอบในพารามิเตอร์ componentsVisibility ของฟังก์ชัน createViewData()

ตัวอย่าง:

useCase.createViewData(
    /* ... */
    componentsVisibility = flowOf(
        MyProjectDebugPanelComponentsVisibility (
            button1 = false ,
            button2 = true ,
        )
    )
)

ในกรณีนี้ button1 จะถูกซ่อนและ button2 จะมองเห็นได้

ส่วนประกอบ

ชื่อ	ชนิดข้อมูลที่คงอยู่	การกำหนดค่า
debugpaneltoggle	Boolean	ค่า Boolean เริ่มต้น
debugpanellabel	-	Flow<String>
debugpaneltextfield	String	ค่า String เริ่มต้น
debugpanelbutton	-	ค่าเริ่มต้น () -> Unit
debugpanelpicker	String	ค่า String เริ่มต้นแทนตัวระบุรายการที่เลือก
debugpaneldatepicker	Long	ค่าเริ่ม Long เป็นตัวแทนของยุคในมิลลิวินาที
enum	String	ค่า enum เริ่มต้น

คำอธิบายประกอบ

@debugpanel

แผงควบคุมการดีบักได้รับการกำหนดค่าโดยใช้ @DebugPanel(val prefix: String, val packageName: String) คำอธิบายประกอบ

• prefix รวมอยู่ในกรณีการใช้งานที่สร้างขึ้นและคลาสที่เก็บ
  
  
• packageName เป็นที่ที่ไฟล์จะถูกส่งออกภายในโฟลเดอร์ generated
  
  

@identifier

โดยค่าเริ่มต้นค่าจะถูกบันทึกไว้ในการตั้งค่าโดยใช้ชื่อฟิลด์เป็นตัวระบุ อย่างไรก็ตามพฤติกรรมนี้สามารถแทนที่ได้โดยใช้คำอธิบายประกอบ @Identifier(val value: String)
สำหรับตัวอย่างสิ่งนี้มีประโยชน์ในกรณีที่คุณต้องการแทนที่แผงการดีบักเก่าด้วยอันนี้และเก็บกุญแจดั้งเดิมไว้

ตัวอย่าง:

@Identifier( " PREVIEW_MODE " )
val preview : DebugPanelToggle 

@displayname

โดยค่าเริ่มต้นส่วนประกอบจะปรากฏขึ้นข้างฉลากที่มีชื่อฟิลด์เป็นค่า คุณสามารถใช้คำอธิบายประกอบ @DisplayName(val value: String) เพื่อให้ส่วนประกอบมีป้ายกำกับที่มีความหมายมากขึ้น

ตัวอย่าง:

@DisplayName( " Preview Mode " )
val preview : DebugPanelToggle 

@DebugProperty

คุณสามารถใช้คำอธิบายประกอบ @DebugProperty(val name: String) เพื่อสร้างส่วนประกอบที่ถูกผูกไว้กับคุณสมบัติคลาส
ตัวอย่างเช่นคุณสามารถมีพื้นที่เก็บข้อมูลที่มี String หรือคุณสมบัติ Flow<String> และโดยการใส่คำอธิบายประกอบบนฟิลด์ไลบรารีจะสร้างคุณสมบัติตัวแทน
จากนั้นคุณสามารถเปิดเผยฟิลด์ผู้แทนนี้ในอินเทอร์เฟซและผู้โทรจะได้รับค่าภายในของคุณหรือหนึ่งจากแผงดีบั๊ก (ในกรณีที่มีการแทนที่)
โปรดทราบว่าคำอธิบายประกอบนี้สามารถใช้กับประเภท: String , Boolean , Enum , Flow<String> , Flow<Boolean> และ Flow<Enum>

ตัวอย่าง:

Repository.kt

 interface Repository {
    val value : Flow < String >
}

RepositoryImpl.kt

 class RepositoryImpl : Repository {
    @Identifier( " custom_value_identifier " )
    @DebugProperty( " value " )
    val internalValue = flowOf( " String value " )

    override val value by RepositoryImplValueDelegate
}

ผู้โทร:

 val repository : Repository = RepositoryImpl ()

repository.value.map {
    println ( " Repository value: $it " )
}

สิ่งนี้จะพิมพ์
Repository value: String value หรือ Repository value: Overridden value ขึ้นอยู่กับว่า Overridden value ได้รับการป้อนข้อมูลภายในฟิลด์ข้อความที่สร้างขึ้น

การล้างค่าส่วนประกอบ

พื้นที่เก็บข้อมูลที่สร้างขึ้นมาพร้อมกับวิธี resetSettings() ที่คุณสามารถโทรหาเพื่อล้างค่าส่วนประกอบที่คงอยู่ โปรดทราบว่าโมเดลมุมมองแผงดีบักไม่ผูกพันกับค่าเหล่านี้ดังนั้นคุณจะต้องออกจากหน้าจอดีบั๊กหรือฆ่าแอปพลิเคชันเพื่อให้แน่ใจว่าค่ารีเซ็ตอย่างถูกต้อง (ดู RootViewModelImpl.kt ในโฟลเดอร์แอปพลิเคชันตัวอย่าง)

สถาปัตยกรรม

กรณีการใช้งานที่สร้างขึ้นและการใช้งานที่เก็บมีตัวปรับเปลี่ยน open ซึ่งหมายความว่าคุณสามารถขยายได้เพื่อเพิ่มฟังก์ชันการทำงานมากขึ้นหากคุณต้องการ
หากโครงการของคุณมีห้องสมุดฉีดพึ่งพาเช่น Koin และคุณมีชั้นเรียนขยายของคุณเองคุณสามารถใส่คำอธิบายประกอบได้ด้วย @Factory หรือ @Single
หากคุณไม่จำเป็นต้องแทนที่ชั้นเรียนเหล่านี้คุณสามารถวางไว้ด้วยตนเองในโมดูลการฉีดพึ่งพา

ใบอนุญาต

แผงการดีบักคือ© 2013-2023 Mirego และอาจมีการแจกจ่ายอย่างอิสระภายใต้ใบอนุญาต BSD ใหม่ ดูไฟล์ LICENSE.md

เกี่ยวกับ mirego

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

นอกจากนี้เรายังรักซอฟต์แวร์โอเพนซอร์ซและเราพยายามที่จะตอบแทนชุมชนให้มากที่สุดเท่าที่จะทำได้