Images & Resources

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

ဒီခန်းပြီးရင် ဘာတတ်သွားမလဲ

Images & Resources ကို ကြောက်စရာမလိုအောင် နားလည်မယ်
ကိုယ်တိုင် Android Studio/Compose code ကို run ကြည့်တတ်မယ်
Real project ထဲမှာ ဒီ concept ကို ချက်ချင်း အသုံးချတတ်မယ်

ခဏလေး ဒီလိုပဲ စဉ်းစားကြည့်

Android project ထဲက `res/` folder အောက်မှာ resource type အလိုက် sub-folder ခွဲထားပါတယ် — `drawable/` (image, icon), `values/strings.xml` (text string, translation-friendly), `values/colors.xml` (color palette)။ String/color ကို hardcode မရေးဘဲ resource file ထဲက reference (`stringResource(R.string.app_name)`) ကို သုံးရင် — app ကို ဘာသာစကား အများ support ဖို့ (localization) ပိုလွယ်ကူပါတယ်.

လက်တွေ့ scenario နဲ့ ချိတ်ကြည့်မယ်

`res/drawable/logo.png` ကို ထည့်ထားရင် Compose ထဲမှာ `Image(painter = painterResource(R.drawable.logo), contentDescription = "App logo")` လို့ ခေါ်သုံးနိုင်ပါတယ် — `contentDescription` ကို accessibility (screen reader) အတွက် ထည့်ပေးသင့်ပါတယ်။ `res/values/strings.xml` ထဲမှာ `<string name="welcome_message">Welcome!</string>` ရေးထားရင် `stringResource(R.string.welcome_message)` နဲ့ Compose ထဲက ခေါ်သုံးနိုင်ပါတယ်.

res/drawable/ = image/icon resource, res/values/strings.xml = text string
painterResource(), stringResource() = resource ကို Compose ထဲက ခေါ်သုံးခြင်း
contentDescription = accessibility (screen reader) support အတွက် ထည့်ရန်

အတူတူ ကြည့်မယ်

kotlin

@Composable
fun WelcomeHeader() {
    Column(horizontalAlignment = Alignment.CenterHorizontally) {
        Image(
            painter = painterResource(id = R.drawable.logo),
            contentDescription = "App logo",
            modifier = Modifier.size(80.dp)
        )
        Text(text = stringResource(id = R.string.welcome_message))
    }
}

You should see

Logo image ရဲ့ အောက်မှာ strings.xml ကနေ ဆွဲယူထားတဲ့ welcome text ကို screen ပေါ်မှာ တွေ့ရမည်။

၅ မိနစ် စမ်းကြည့်

`res/values/strings.xml` ထဲမှာ string resource တစ်ခု ကိုယ်တိုင် ထည့်ရေးပြီး, `stringResource()` နဲ့ Compose ထဲက ခေါ်သုံးကြည့်ပါ။

သတိလေးတစ်ချက်

Large image (high resolution photo) ကို optimize မလုပ်ဘဲ `drawable/` ထဲ တိုက်ရိုက် ထည့်ခြင်း — app size ကြီးလာပြီး, download/install time ကို ထိခိုက်နိုင်ပါတယ် — WebP format သုံးခြင်း/resize လုပ်ခြင်းကို စဉ်းစားပါ။

ဒီနေရာမှာ လူအများမှားတတ်တယ်

Text string ကို Composable code ထဲမှာ hardcode (`Text("Welcome!")`) ရေးနေခြင်း — localization/maintainability အတွက် `strings.xml` ကို သုံးသင့်ပါတယ်
`Image` composable မှာ `contentDescription = null` ကို decorative image မဟုတ်တဲ့ (meaningful) image အတွက်ပါ သုံးခြင်း — accessibility ချို့ယွင်းစေပါတယ်

အခု ကိုယ်တိုင် စမ်းကြည့်

You'll know it worked when: Logo image ရဲ့ အောက်မှာ strings.xml ကနေ ဆွဲယူထားတဲ့ welcome text ကို screen ပေါ်မှာ တွေ့ရမည်။