Layout Control (Grid, StackPanel, DockPanel, WrapPanel)

XAML এবং UI Design Techniques - উইন্ডোজ ডেভেলপমেন্ট (Windows Development) - Microsoft Technologies

263

Windows Presentation Foundation (WPF), UWP (Universal Windows Platform), এবং WinUI অ্যাপ্লিকেশন তৈরি করার জন্য ব্যবহৃত বিভিন্ন লেআউট কন্ট্রোল রয়েছে, যেগুলো UI-কে আরও কার্যকরী এবং ব্যবহারকারী-বান্ধব করতে সহায়তা করে। এই লেআউট কন্ট্রোলগুলি UI কম্পোনেন্টগুলোর সঠিকভাবে অবস্থান নির্ধারণ করতে সহায়তা করে এবং অ্যাপ্লিকেশনকে সঠিক আঙ্গিকে প্রদর্শিত হতে সাহায্য করে।

এই টিউটোরিয়ালে Grid, StackPanel, DockPanel, এবং WrapPanel কন্ট্রোলগুলির বিশদ বর্ণনা এবং ব্যবহার দেখানো হবে।


১. Grid

Grid হলো একটি বহুল ব্যবহৃত লেআউট কন্ট্রোল, যা UI উপাদানগুলোকে সারি এবং কলামে বিভক্ত করে।

বৈশিষ্ট্য:

  • Rows এবং Columns ডিফাইন করা যায়।
  • সেলগুলির মধ্যে উপাদানগুলিকে সজ্জিত এবং সাজানো হয়।
  • RowDefinition এবং ColumnDefinition ব্যবহার করে সারি এবং কলামের আকার নিয়ন্ত্রণ করা যায়।

উদাহরণ:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="2*"/>
    </Grid.ColumnDefinitions>

    <TextBlock Grid.Row="0" Grid.Column="0" Text="Header"/>
    <Button Grid.Row="1" Grid.Column="1" Content="Click Me"/>
    <TextBox Grid.Row="2" Grid.Column="0" Text="Footer"/>
</Grid>

ব্যাখ্যা:

  • RowDefinition এবং ColumnDefinition দিয়ে সারি ও কলামের আকার নির্ধারণ করা হয়েছে।
  • Grid.Row এবং Grid.Column দিয়ে UI উপাদানগুলোর অবস্থান নির্ধারণ করা হয়েছে।

২. StackPanel

StackPanel হলো একটি সাধারণ লেআউট কন্ট্রোল, যা উপাদানগুলোকে একে অপরের উপরে বা পাশে সাজিয়ে রাখে। এটি হরাইজনটাল বা ভারটিক্যাল সাজানোর জন্য ব্যবহার করা যেতে পারে।

বৈশিষ্ট্য:

  • উপাদানগুলোকে একটি দিক থেকে (অথবা উল্লম্ব বা আড়াআড়ি) সাজানো হয়।
  • সহজ এবং দ্রুত লেআউট তৈরি করার জন্য ব্যবহার হয়।

উদাহরণ:

<StackPanel Orientation="Vertical">
    <Button Content="Button 1"/>
    <Button Content="Button 2"/>
    <Button Content="Button 3"/>
</StackPanel>

ব্যাখ্যা:

  • Orientation="Vertical": এটি বাটনগুলোকে উল্লম্বভাবে সাজাবে।
  • Horizontal ব্যবহৃত হলে উপাদানগুলো আড়াআড়ি সাজানো হবে।

৩. DockPanel

DockPanel কন্ট্রোল ব্যবহার করে উপাদানগুলোকে একে অপরের কাছে একত্রিত করা হয়, যেমন: একে অপরের পাশে বা উপরে/নিচে।

বৈশিষ্ট্য:

  • উপাদানগুলোকে Dock (বাঁয়ে, ডানে, উপরে, নিচে) করে সাজানো হয়।
  • একটি কন্ট্রোল সাধারণত পুরো ডিভাইস বা উইন্ডোর অবশিষ্ট জায়গায় জায়গা নিতে পারে, যদি অন্যান্য কন্ট্রোলগুলি ডক না করা থাকে।

উদাহরণ:

<DockPanel>
    <Button DockPanel.Dock="Top" Content="Top Button"/>
    <Button DockPanel.Dock="Left" Content="Left Button"/>
    <Button DockPanel.Dock="Right" Content="Right Button"/>
    <TextBlock DockPanel.Dock="Bottom" Text="Bottom Text"/>
    <TextBox Content="Main Content"/>
</DockPanel>

ব্যাখ্যা:

  • DockPanel.Dock প্রপার্টি ব্যবহার করে UI উপাদানগুলোর অবস্থান নির্ধারণ করা হয়েছে।
  • Top, Left, Right, এবং Bottom দিয়ে Dock করা হয়েছে, এবং TextBox পুরো উইন্ডোতে দৃশ্যমান হবে।

৪. WrapPanel

WrapPanel কন্ট্রোল উপাদানগুলোর আকারের উপর ভিত্তি করে উপাদানগুলোকে পরবর্তী লাইনে বা কলামে স্থানান্তরিত করে।

বৈশিষ্ট্য:

  • উপাদানগুলো যদি উইন্ডোর আকারের চেয়ে বড় হয়, তবে পরবর্তী লাইনে চলে যায়।
  • সাধারণত গ্রিড বা স্ট্যাক প্যানেলের পরিবর্তে ডাইনামিক লেআউট তৈরি করতে ব্যবহার করা হয়।

উদাহরণ:

<WrapPanel>
    <Button Content="Button 1"/>
    <Button Content="Button 2"/>
    <Button Content="Button 3"/>
    <Button Content="Button 4"/>
    <Button Content="Button 5"/>
</WrapPanel>

ব্যাখ্যা:

  • উপাদানগুলো একে অপরের পাশে সাজানো হবে এবং যদি তারা একটি লাইনে ফিট না হয়, তাহলে পরবর্তী লাইনে চলে যাবে।

প্রতিটি লেআউট কন্ট্রোলের তুলনা

লেআউট কন্ট্রোলবৈশিষ্ট্যব্যবহার
Gridসারি এবং কলামে উপাদান সাজানোকমপ্লেক্স লেআউট, বিভিন্ন উপাদানকে সারি এবং কলামে সাজানো।
StackPanelএকের পর এক উপাদান সাজানো (উল্লম্ব/আড়াআড়ি)সহজ লেআউট, উপাদানগুলোকে একে অপরের উপর বা পাশে সাজানো।
DockPanelউপাদানগুলোকে Dock করা (উপর, নিচ, বাম, ডান)উইন্ডোতে নির্দিষ্ট জায়গায় কন্ট্রোল ডক করা।
WrapPanelউপাদানগুলো স্বয়ংক্রিয়ভাবে পরবর্তী লাইনে চলে যায়ডাইনামিক লেআউট, যেখানে উপাদানগুলো পরবর্তী লাইনে চলে যেতে পারে।

উপসংহার

Grid, StackPanel, DockPanel, এবং WrapPanel প্রতিটি আলাদা লেআউট কন্ট্রোল, যার নিজস্ব সুবিধা এবং ব্যবহারের ক্ষেত্র রয়েছে। এই লেআউট কন্ট্রোলগুলি ব্যবহার করে সহজে এবং কার্যকরভাবে Windows অ্যাপ্লিকেশনের UI ডিজাইন করা যায়, যা ব্যবহারকারীর অভিজ্ঞতা উন্নত করে।

Content added By
Promotion

Are you sure to start over?

Loading...