স্টাইলের সাথে করণীয় এবং করণীয় নয়

এই পৃষ্ঠাটি আপনার কোডবেসে ধারাবাহিকতা অর্জনকারী স্টাইলগুলির সাথে কাজ করার সর্বোত্তম অনুশীলনগুলি বর্ণনা করে, সেইসাথে API ডিজাইন করার সময় আমরা যে নীতিগুলি অনুসরণ করেছি তাও বর্ণনা করে।

কর

এই সেরা অনুশীলনগুলি অনুসরণ করুন:

করণীয়: ভিজ্যুয়ালের জন্য স্টাইল এবং আচরণের জন্য মডিফায়ার ব্যবহার করুন

ভিজ্যুয়াল কনফিগারেশনের জন্য (ব্যাকগ্রাউন্ড, প্যাডিং, বর্ডার) স্টাইলস এপিআই ব্যবহার করুন এবং ক্লিক লজিক, জেসচার ডিটেকশন বা অ্যাক্সেসিবিলিটির মতো আচরণের জন্য মডিফায়ার সংরক্ষণ করুন।

করুন: ডিজাইন সিস্টেমে স্টাইল প্যারামিটারগুলি প্রকাশ করুন

আপনার নিজস্ব কাস্টম ডিজাইন-সিস্টেম উপাদানগুলির জন্য, আপনার মডিফায়ার প্যারামিটারের পরে একটি Style অবজেক্ট এক্সপোজ করা উচিত।

@Composable
fun GradientButton(
    modifier: Modifier = Modifier,
    // ✅ DO: for design system components, expose a style modifier to consumers to be able to customize the components
    style: Style = Style
) {
    // Consume the style
}

করুন: ভিজ্যুয়াল-ভিত্তিক প্যারামিটারগুলিকে একটি স্টাইল দিয়ে প্রতিস্থাপন করুন

আপনার কম্পোজেবলের প্যারামিটারগুলিকে একটি একক Style প্যারামিটার দিয়ে প্রতিস্থাপন করার কথা বিবেচনা করুন। উদাহরণস্বরূপ:

// Before
@Composable
fun OldButton(background: Color, fontColor: Color) {
}

// After
// ✅ DO: Replace visual-based parameters with a style that includes same properties
@Composable
fun NewButton(style: Style = Style) {
}

করুন: অ্যানিমেশনের জন্য স্টাইলগুলিকে অগ্রাধিকার দিন

মডিফায়ারের তুলনায় কর্মক্ষমতা বৃদ্ধির জন্য অ্যানিমেশন সহ স্টেট-ভিত্তিক স্টাইলিংয়ের জন্য বিল্ট-ইন animate ব্লক ব্যবহার করুন।

করুন: "শেষ লেখার-জয়" এর সুবিধা নিন

style প্রোপার্টি স্ট্যাকের পরিবর্তে ওভাররাইট করে, এই সুবিধাটি কাজে লাগান। একাধিক প্যারামিটার ছাড়াই ডিফল্ট কম্পোনেন্ট বর্ডার বা ব্যাকগ্রাউন্ড ওভাররাইড করতে এটি ব্যবহার করুন।

কি করবেন না

নিম্নলিখিত ধরণগুলি নিরুৎসাহিত করা হচ্ছে:

করবেন না: ইন্টারঅ্যাকশন লজিকের জন্য স্টাইল ব্যবহার করুন

কোনও স্টাইলের মধ্যে onClick বা অঙ্গভঙ্গি সনাক্তকরণ পরিচালনা করার চেষ্টা করবেন না। স্টাইলগুলি স্থিতির উপর ভিত্তি করে ভিজ্যুয়াল কনফিগারেশনের মধ্যে সীমাবদ্ধ, তাই তাদের ব্যবসায়িক যুক্তি পরিচালনা করা উচিত নয়; পরিবর্তে, তাদের কেবল স্থিতির উপর ভিত্তি করে একটি ভিন্ন ভিজ্যুয়াল থাকা উচিত।

করবেন না: ডিফল্ট প্যারামিটার হিসেবে একটি ডিফল্ট স্টাইল প্রদান করুন।

স্টাইল প্যারামিটারগুলি সর্বদা style: Style = Style :

@Composable
fun BadButton(
    modifier: Modifier = Modifier,
    // ❌ DON'T set a default style here as a parameter
    style: Style = Style { background(Color.Red) }
) {
}

"ডিফল্ট" প্যারামিটার অন্তর্ভুক্ত করতে, ইনকামিং প্যারামিটার স্টাইলটিকে ডিফল্ট সংজ্ঞায়িতের সাথে মার্জ করুন:

@Composable
fun GoodButton(
    modifier: Modifier = Modifier,
    // ✅ Do: always pass it as a Style, do not pass other defaults
    style: Style = Style
) {
    // ...
    val defaultStyle = Style { background(Color.Red) }
    // ✅ Do Combine defaults inside with incoming parameter
    Box(modifier = modifier.styleable(styleState, defaultStyle, style)) {
      // your logic
    }
}

করবেন না: লেআউট-ভিত্তিক কম্পোজেবলগুলিতে স্টাইল প্যারামিটার সরবরাহ করুন

যদিও আপনি যেকোনো কম্পোজেবলকে একটি স্টাইল প্রদান করতে পারেন, তবে লেআউট-ভিত্তিক কম্পোজেবল, অথবা স্ক্রিন-লেভেল কম্পোজেবল, স্টাইল গ্রহণ করবে বলে আশা করা যায় না - গ্রাহকের দৃষ্টিকোণ থেকে এই স্তরে একটি স্টাইল কী করবে তা স্পষ্ট নয়। স্টাইলগুলি উপাদানগুলির জন্য ডিজাইন করা হয়, অগত্যা লেআউটগুলির জন্য নয়।