paint-brush
SwiftUI এর 5 প্রধান সম্পত্তির মোড়ক এবং কীভাবে সেগুলি কার্যকরভাবে ব্যবহার করবেনদ্বারা@tseitlin
3,473 পড়া
3,473 পড়া

SwiftUI এর 5 প্রধান সম্পত্তির মোড়ক এবং কীভাবে সেগুলি কার্যকরভাবে ব্যবহার করবেন

দ্বারা Mykhailo Tseitlin 9m2023/05/31
Read on Terminal Reader
Read this story w/o Javascript

অতিদীর্ঘ; পড়তে

SwiftUI হল iOS এবং macOS-এ ইউজার ইন্টারফেস তৈরির জন্য একটি কাঠামো। SwiftUI এর সাহায্যে, আপনি বর্ণনা করতে পারেন যে আপনার ইন্টারফেসটি কী করা উচিত এবং কেমন হওয়া উচিত এবং ফ্রেমওয়ার্ক বাকিটির যত্ন নেবে। SwiftUI এর পাঁচটি প্রধান সম্পত্তির মোড়ক রয়েছে: @State, @Binding, @ObservedObject, @StateObject এবং @EnvironmentObject।
featured image - SwiftUI এর 5 প্রধান সম্পত্তির মোড়ক এবং কীভাবে সেগুলি কার্যকরভাবে ব্যবহার করবেন
Mykhailo Tseitlin  HackerNoon profile picture
0-item
1-item


এই যে! আমি আপনাকে SwiftUI সম্পর্কে বলতে চাই, iOS এবং macOS-এ ব্যবহারকারী ইন্টারফেস তৈরির জন্য একটি কাঠামো। এটি ব্যবহার করা খুব সুবিধাজনক কারণ এটি প্রোগ্রামিংয়ের একটি ঘোষণামূলক পদ্ধতির নিয়োগ করে। SwiftUI এর সাহায্যে, আপনি বর্ণনা করতে পারেন যে আপনার ইন্টারফেসটি কী করা উচিত এবং কেমন হওয়া উচিত এবং ফ্রেমওয়ার্ক বাকিটির যত্ন নেবে।


SwiftUI এর অন্যতম প্রধান উপাদান হল প্রপার্টি র‍্যাপার ব্যবহার করা। এইগুলি কার্যকরী উপাদান যা আপনাকে বৈশিষ্ট্যগুলির জন্য অতিরিক্ত যুক্তি প্রদান করতে দেয়।


SwiftUI এর পাঁচটি প্রধান সম্পত্তির মোড়ক রয়েছে:

  1. @অবস্থা

  2. @ বাঁধাই

  3. @অবজার্ভডঅবজেক্ট

  4. @StateObject

  5. @এনভায়রনমেন্ট অবজেক্ট


তারা উন্নয়নে আপনার সেরা বন্ধু হয়ে উঠবে।


@অবস্থা


@State আপনাকে এমন বৈশিষ্ট্যগুলি তৈরি করতে দেয় যা পরিবর্তন করা যেতে পারে এবং প্রয়োজন হলে, এই পরিবর্তনগুলির উপর ভিত্তি করে ইন্টারফেস আপডেট করুন। উদাহরণস্বরূপ, আপনি যদি এমন একটি বোতাম তৈরি করতে চান যা চাপলে এর রঙ পরিবর্তন করে, আপনি রঙ সংরক্ষণ করতে এবং বোতামে এটি যুক্ত করতে একটি @State ভেরিয়েবল তৈরি করতে পারেন:


 struct MyButton: View { @State var buttonColor = Color.blue var body: some View { Button("Press me!") { buttonColor = Color.red } .background(buttonColor) } }


@ বাঁধাই


@Binding আপনাকে কোডের এক অংশে কোডের অন্য অংশে সংরক্ষিত একটি মান ব্যবহার করতে দেয়। এটি সাধারণত সুইফটইউআই-এ ব্যবহার করা হয় একটি ভিউ থেকে অন্য ভিউতে একটি মান পাস করার জন্য, তাদের একে অপরের সাথে যোগাযোগ করার অনুমতি দেয়। উদাহরণস্বরূপ, কল্পনা করুন আমাদের দুটি দর্শন রয়েছে - একটি পাঠ্য ক্ষেত্র সহ এবং অন্যটি একটি বোতাম সহ। ব্যবহারকারী যখন বোতাম টিপে তখন আমরা পাঠ্য ক্ষেত্রটি আপডেট করতে চাই। এটি করার জন্য, আমরা @Binding ব্যবহার করতে পারি:


 struct ContentView: View { @State private var text = "" var body: some View { VStack { TextField("Enter text", text: $text) Button("Update text") { text = "New text" } SecondView(text: $text) } } } struct SecondView: View { @Binding var text: String var body: some View { Text(text) } }


এই উদাহরণে, @Binding ব্যবহার করা হয় $text (যা ContentView- এ আছে) থেকে টেক্সটে (যা সেকেন্ডভিউ- তে আছে), তাই যখন ব্যবহারকারী বোতাম টিপে, টেক্সট ফিল্ড আপডেট করবে এবং নতুন টেক্সট প্রদর্শন করবে।


@অবজার্ভডঅবজেক্ট


@ObservedObject বৈশিষ্ট্যগুলি চিহ্নিত করতে ব্যবহৃত হয় যা পর্যবেক্ষণ করা হয় এবং বহিরাগত ডেটা পরিবর্তনের উপর নির্ভর করে পরিবর্তন হতে পারে। এই প্রপার্টি র‍্যাপার অবজেক্টের পরিবর্তনে সাবস্ক্রাইব করে যা ObservableObject প্রোটোকলের সাথে সামঞ্জস্য করে এবং ডেটা পরিবর্তিত হলে ইন্টারফেসের প্রাসঙ্গিক অংশগুলি স্বয়ংক্রিয়ভাবে আপডেট করে। এখানে @ObservedObject ব্যবহার করার একটি সংক্ষিপ্ত উদাহরণ:

 class UserData: ObservableObject { @Published var name = "John" } struct ContentView: View { @ObservedObject var userData = UserData() var body: some View { VStack { Text("Hello, \(userData.name)!") TextField("Enter your name", text: $userData.name) } } }


এই উদাহরণে, আমরা UserData নামে একটি ক্লাস তৈরি করি, যেটিতে একটি @Published নাম রয়েছে। ContentView কাঠামোতে, আমরা @ObservedObject ব্যবহার করে UserData টাইপ সহ userData নামে একটি প্রপার্টি তৈরি করি। আমরা userData.name এর মান একটি পাঠ্য ক্ষেত্রে প্রদর্শন করি এবং এটি স্ক্রিনে আউটপুট করি।


ব্যবহারকারী যখন টেক্সট ফিল্ডে মান পরিবর্তন করে, তখন SwiftUI স্বয়ংক্রিয়ভাবে ইন্টারফেসের সংশ্লিষ্ট অংশ আপডেট করে, কারণ নামের সম্পত্তি @Published ব্যবহার করে প্রকাশিত ও পর্যবেক্ষণ করা হয়। এর মানে ইন্টারফেস আপডেট করার জন্য আমাদের নিজস্ব কোডের প্রয়োজন নেই এবং আমরা SwiftUI কে আমাদের জন্য এটি করার অনুমতি দিই।


দ্রষ্টব্য: আপনি যদি না জানেন, @Published হল কম্বাইন ফ্রেমওয়ার্ক থেকে একটি প্রপার্টি র‍্যাপার যা একটি ক্লাস বা স্ট্রাকচার প্রপার্টিতে যোগ করা যেতে পারে, যা স্বয়ংক্রিয়ভাবে সেই সম্পত্তির মান পরিবর্তনের বিজ্ঞপ্তি পাঠায় যে কেউ এটিতে সদস্যতা নিয়েছে। . অন্য কথায়, এটি বৈশিষ্ট্যগুলির জন্য একটি সহায়ক বৈশিষ্ট্য যা পরিবর্তনের জন্য ট্র্যাক করা যেতে পারে।


@StateObject


@StateObject হল একটি প্রপার্টি র‍্যাপার যা একটি ক্লাস অবজেক্ট শুরু করতে এবং SwiftUI-তে ভিউ স্টেটে সংরক্ষণ করতে ব্যবহৃত হয়। এর মানে হল যে অবজেক্টটি যতক্ষণ পর্যন্ত দৃশ্যটি বিদ্যমান থাকে ততক্ষণ সংরক্ষণ করা হয় এবং এটির সাথে ধ্বংস হয়ে যায়। সাধারণত, @StateObject ব্যবহার করা ক্লাস অবজেক্টের জন্য আরও ব্যবহারিক যেগুলি একাধিক দর্শনের জন্য প্রয়োজন, শুধুমাত্র একটি নয়। উদাহরণ স্বরূপ:


 class UserData: ObservableObject { @Published var name = "John" @Published var age = 30 } struct ContentView: View { @StateObject var userData = UserData() var body: some View { NavigationView { VStack { Text("Name: \(userData.name)") Text("Age: \(userData.age)") NavigationLink( destination: ProfileView(userData: userData), label: { Text("Edit Profile") }) } .navigationTitle("Home") } } } struct ProfileView: View { @ObservedObject var userData: UserData var body: some View { Form { TextField("Name", text: $userData.name) Stepper("Age: \(userData.age)", value: $userData.age) } .navigationTitle("Profile") } }


এই উদাহরণে, UserData হল একটি ক্লাসের একটি অবজেক্ট যাতে বেশ কয়েকটি বৈশিষ্ট্য রয়েছে যা একাধিক দর্শনে ব্যবহার করা যেতে পারে। ক্লাসটি ObservableObject হিসাবে চিহ্নিত করা হয়েছে তাই এটি @StateObject এবং @ObservedObject এর সাথে ব্যবহার করা যেতে পারে।


ContentView-এ, আমরা @StateObject ব্যবহার করে একটি নতুন UserData অবজেক্ট তৈরি করি যাতে বিভিন্ন ভিউয়ের মধ্যে ট্রানজিশনের মধ্যে স্টেট সেভ করা যায়। এই ক্ষেত্রে, ContentView ব্যবহারকারীর ডেটা প্রদর্শন করে, এটিকে ভিজ্যুয়ালাইজ করে এবং অন্য ভিউ (প্রোফাইলভিউ) এর একটি লিঙ্ক রয়েছে যা ব্যবহারকারীর ডেটা সম্পাদনা করতে ব্যবহার করা যেতে পারে।


ProfileView- এ, আমরা ব্যবহারকারীর ডেটা পরিবর্তন করতে @ObservedObject ব্যবহার করে একই UserData অবজেক্টে অ্যাক্সেস পাই। যখন ব্যবহারকারী ডেটা পরিবর্তন করে, তখন এটি স্বয়ংক্রিয়ভাবে ContentView- এ আপডেট হয় কারণ একই UserData অবজেক্ট ব্যবহার করা হয়।


দ্রষ্টব্য: @ObservedObject ব্যবহার করুন যদি আপনি একটি ভিউ থেকে একটি ক্লাস অবজেক্টে পরিবর্তনগুলি পর্যবেক্ষণ করতে চান এবং @StateObject ব্যবহার করুন যদি আপনি একটি ক্লাস অবজেক্টের অবস্থা সংরক্ষণ করতে চান যা একাধিক দর্শনের প্রদর্শনকে প্রভাবিত করে।


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


@এনভায়রনমেন্ট অবজেক্ট


@EnvironmentObject হল একটি প্রপার্টি র‍্যাপার যাতে সুইফটইউআই ভিউ হায়ারার্কির মাধ্যমে ডেটা অবজেক্ট পি অ্যাসিং করা যায়। এটি এনভায়রনমেন্ট কন্টেইনার (যেমন, দৃশ্য, দৃশ্য, অ্যাপ, ইত্যাদি) এর অন্তর্গত SwiftUI অনুক্রমের যেকোনো ভিউ থেকে ডেটা অবজেক্টে অ্যাক্সেসের অনুমতি দেয়। উদাহরণস্বরূপ, কল্পনা করুন আমাদের কাছে একটি টাস্ক লিস্ট ম্যানেজমেন্ট অ্যাপ আছে। আমাদের কাছে একটি রুট কন্টেন্টভিউ থাকতে পারে যাতে কাজের তালিকা এবং নতুন কাজ তৈরি করার ক্ষমতা থাকে। এর জন্য, আমরা একটি পৃথক TaskListView ভিউ তৈরি করি যা কাজের তালিকা এবং নতুন কাজ যোগ করার জন্য একটি বোতাম প্রদর্শন করে। একটি নতুন টাস্ক যোগ করার পরে, ব্যবহারকারীকে অ্যাড টাস্ক স্ক্রিনে পুনঃনির্দেশিত করা উচিত, তাই আমরা একটি পৃথক AddTaskView ভিউ তৈরি করি।


তিনটি ভিউতে UserManager অবজেক্টটি পাস করতে, আমরা ContentView- এ এর উদাহরণ তৈরি করতে পারি এবং তারপর এটিকে একটি প্যারামিটার হিসাবে TaskListView এবং AddTaskView উভয়ের কাছে পাস করতে পারি। যাইহোক, এটি একটি সমস্যা হয়ে উঠতে পারে যদি আমরা আরও বেশি নেস্টেড ভিউ যোগ করার সিদ্ধান্ত নিই, কারণ আমাদের অনেক মধ্যবর্তী ভিউয়ের মধ্য দিয়ে UserManager পাস করতে হবে।


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

 struct TaskManagerApp: App { @StateObject var userManager = UserManager() var body: some Scene { WindowGroup { ContentView() .environmentObject(userManager) } } } struct ContentView: View { var body: some View { NavigationView { TaskListView() } } } struct TaskListView: View { @EnvironmentObject var userManager: UserManager var body: some View { List(userManager.tasks) { task in TaskRow(task: task) } .navigationBarTitle("Tasks") .navigationBarItems(trailing: Button(action: { // Navigate to AddTaskView }) { Image(systemName: "plus") } ) } } struct AddTaskView: View { @EnvironmentObject var userManager: UserManager var body: some View { // Add new task using userManager } }


সুতরাং, এখন UserManager অবজেক্ট স্বয়ংক্রিয়ভাবে @EnvironmentObject এর মাধ্যমে TaskListView এবং AddTaskView- এ পাস করা হবে। মনে রাখবেন যে আমরা একটি ভিউতে UserManager- এর অবস্থা পরিবর্তন করতে পারি, এবং পরিবর্তনগুলি স্বয়ংক্রিয়ভাবে অন্য ভিউতে প্রতিফলিত হবে।



নিবন্ধটি মৌলিক SwiftUI সম্পত্তির মোড়কগুলিকে কভার করেছে: @State, @Binding, @ObservedObject, @StateObject, @EnvironmentObject।


এই সম্পত্তির মোড়কগুলি SwiftUI-তে অ্যাপ স্টেটের সাথে কাজ করার ভিত্তি তৈরি করে। আপনার নখদর্পণে মৌলিক সম্পত্তি মোড়ক পেতে এই নিবন্ধটি একটি চিট শীট হিসাবে ব্যবহার করুন, SwiftUI-এর সাথে অ্যাপ্লিকেশনগুলি তৈরি করার জন্য প্রয়োজনীয়৷ এই জ্ঞান প্রয়োগ করে, আপনি গতিশীলভাবে পরিবর্তনশীল অবস্থার সাথে আরও জটিল ইউজার ইন্টারফেস তৈরি করতে এবং আপনার মডেলগুলি থেকে সুইফটইউআই-তে ডেটা সংহত করতে সক্ষম হবেন।