স্যাকপ্যানেলের বাচ্চাদের কীভাবে সর্বোচ্চ স্থানটি নিচের দিকে পূরণ করতে হয়?


356

আমি কেবল বামদিকে প্রবাহিত পাঠ্য এবং ডানদিকে একটি সহায়তা বাক্স চাই।

সহায়তা বাক্সটি নীচে সমস্ত দিক পর্যন্ত প্রসারিত করা উচিত।

যদি আপনি StackPanelনীচের বাইরেরটি বাইরে নিয়ে যান তবে এটি দুর্দান্ত কাজ করে।

তবে লেআউটের কারণে (আমি গতিশীলভাবে ইউজারকন্ট্রোলগুলি সন্নিবেশ করছি) আমার মোড়ানো দরকার StackPanel

আমি কীভাবে GroupBoxএর নীচের অংশে প্রসারিত করব StackPanel, আপনি দেখতে পাচ্ছেন যে আমি চেষ্টা করেছি:

  • VerticalAlignment="Stretch"
  • VerticalContentAlignment="Stretch"
  • Height="Auto"

XAML:

<Window x:Class="TestDynamic033.Test3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Test3" Height="300" Width="600">
    <StackPanel 
        VerticalAlignment="Stretch" 
        Height="Auto">

        <DockPanel 
            HorizontalAlignment="Stretch" 
            VerticalAlignment="Stretch" 
            Height="Auto" 
            Margin="10">

            <GroupBox 
                DockPanel.Dock="Right" 
                Header="Help" 
                Width="100" 
                Background="Beige" 
                VerticalAlignment="Stretch" 
                VerticalContentAlignment="Stretch" 
                Height="Auto">
                <TextBlock Text="This is the help that is available on the news screen." TextWrapping="Wrap" />
            </GroupBox>

            <StackPanel DockPanel.Dock="Left" Margin="10" Width="Auto" HorizontalAlignment="Stretch">
                <TextBlock Text="Here is the news that should wrap around." TextWrapping="Wrap"/>
            </StackPanel>

        </DockPanel>
    </StackPanel>
</Window>

উত্তর:

ধন্যবাদ মার্ক, DockPanelপরিবর্তে এটি StackPanelপরিষ্কার করে ব্যবহার করে। সাধারণভাবে, আমি নিজেকে DockPanelএখন ডাব্লুপিএফ লেআউটিংয়ের জন্য আরও বেশি বেশি ব্যবহার করতে দেখছি, এখানে স্থির এক্সএএমএল রয়েছে:

<Window x:Class="TestDynamic033.Test3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Test3" Height="300" Width="600" MinWidth="500" MinHeight="200">
    <DockPanel 
        VerticalAlignment="Stretch" 
        Height="Auto">

        <DockPanel 
            HorizontalAlignment="Stretch" 
            VerticalAlignment="Stretch" 
            Height="Auto" 
            MinWidth="400"
            Margin="10">

            <GroupBox 
                DockPanel.Dock="Right" 
                Header="Help" 
                Width="100" 
                VerticalAlignment="Stretch" 
                VerticalContentAlignment="Stretch" 
                Height="Auto">
                <Border CornerRadius="3" Background="Beige">
                    <TextBlock Text="This is the help that is available on the news screen." TextWrapping="Wrap" 

                Padding="5"/>
                </Border>
            </GroupBox>

            <StackPanel DockPanel.Dock="Left" Margin="10" Width="Auto" HorizontalAlignment="Stretch">
                <TextBlock Text="Here is the news that should wrap around." TextWrapping="Wrap"/>
            </StackPanel>

        </DockPanel>
    </DockPanel>
</Window>

ফর্ম্যাটিং স্থির করে - কোনও তালিকা থেকে কোডে সোজা যেতে পছন্দ করে না
গ্রেগ

1
আপনি কি নিজের মতো করে একটি গ্রুপবক্স প্রসারিত করতে পারেন? যদি তা হয় তবে আপনার প্যারেন্ট উপাদানগুলি একে অপরকে যুক্ত করা শুরু করুন যতক্ষণ না আপনি কোনটি লেআউটটি ভঙ্গ করছেন।
ড্রয় নোকস

রবার্গ: জেনে ভালো লাগলো, যে আমাকে বিভ্রান্ত করেছিল, ধন্যবাদ
এডওয়ার্ড টাঙ্গুয়ে

1
ধন্যবাদ। আপনার উত্তরটি ব্যবহার করে আমি আমার খুব অনুরূপ সমস্যা সমাধানের জন্য 2 নেস্টড ডকপ্যানেল ব্যবহার করতে সক্ষম হয়েছি!
ইয়াবলারগো

উত্তর:


344

মনে হচ্ছে আপনি এমন একটি জায়গা চান StackPanelযেখানে চূড়ান্ত উপাদানটি বাকি সমস্ত স্থান ব্যবহার করে। তবে কেন ব্যবহার করবেন না DockPanel? মধ্যে অন্যান্য উপাদান সাজাইয়া DockPanelসঙ্গে DockPanel.Dock="Top", এবং তারপর আপনার সাহায্যের নিয়ন্ত্রণ অবশিষ্ট স্থান পূরণ করতে পারেন।

XAML:

<DockPanel Width="200" Height="200" Background="PowderBlue">
    <TextBlock DockPanel.Dock="Top">Something</TextBlock>
    <TextBlock DockPanel.Dock="Top">Something else</TextBlock>
    <DockPanel
        HorizontalAlignment="Stretch" 
        VerticalAlignment="Stretch" 
        Height="Auto" 
        Margin="10">

      <GroupBox 
        DockPanel.Dock="Right" 
        Header="Help" 
        Width="100" 
        Background="Beige" 
        VerticalAlignment="Stretch" 
        VerticalContentAlignment="Stretch" 
        Height="Auto">
        <TextBlock Text="This is the help that is available on the news screen." 
                   TextWrapping="Wrap" />
     </GroupBox>

      <StackPanel DockPanel.Dock="Left" Margin="10" 
           Width="Auto" HorizontalAlignment="Stretch">
          <TextBlock Text="Here is the news that should wrap around." 
                     TextWrapping="Wrap"/>
      </StackPanel>
    </DockPanel>
</DockPanel>

আপনি যদি DockPanelউপলব্ধ না হয়ে প্ল্যাটফর্মে থাকেন (যেমন উইন্ডোজ স্টোর), আপনি গ্রিডের সাহায্যে একই প্রভাব তৈরি করতে পারেন। পরিবর্তে গ্রিড ব্যবহার করে উপরোক্ত উদাহরণটি এখানে দেওয়া হয়েছে:

<Grid Width="200" Height="200" Background="PowderBlue">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0">
        <TextBlock>Something</TextBlock>
        <TextBlock>Something else</TextBlock>
    </StackPanel>
    <Grid Height="Auto" Grid.Row="1" Margin="10">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="100"/>
        </Grid.ColumnDefinitions>
        <GroupBox
            Width="100"
            Height="Auto"
            Grid.Column="1"
            Background="Beige"
            Header="Help">
            <TextBlock Text="This is the help that is available on the news screen." 
              TextWrapping="Wrap"/>
        </GroupBox>
        <StackPanel Width="Auto" Margin="10" DockPanel.Dock="Left">
            <TextBlock Text="Here is the news that should wrap around." 
              TextWrapping="Wrap"/>
        </StackPanel>
    </Grid>
</Grid>

18
উজ্জ্বল! স্ট্যাকপ্যানেলকে এটি কীভাবে করা যায় তা নির্ধারণের জন্য আমি শেষ ঘন্টাটি ব্যয় করেছি। এখন থেকে, আমি এখানে আমার ডাব্লুপিএফ (এবং অন্যান্য) তথ্যের জন্য প্রথমে দেখব।
paxdiablo

7
স্ট্যাকপ্যানেলস যা করতে চেয়েছিল তা করার জন্য আমি কতটা সময় ব্যয় করেছি তা আমি বিশ্বাস করতে পারি না। ভাগ করে নেওয়ার জন্য ধন্যবাদ! ডকপ্যানেলগুলি আমি যা চেয়েছিলাম তা হ'ল।
ডাংলুন্ড

মনে হচ্ছে ট্যাবলেটগুলির জন্য কোনও ডকপ্যানেল নেই। টেলিআর.কম
জেপি

1
উইন্ডোজ স্টোর অ্যাপ্লিকেশনগুলির জন্য কোনও ডক প্যানেল নেই।
তেওমন শিপাহি

এখন এটি সর্বজনীন অ্যাপ সম্পর্কিত এবং সর্বজনীন অ্যাপগুলি ডকপ্যানেলটিকে এখনও সমর্থন করে না?
yonexbat

105

এটি হবার কারণ হ'ল স্ট্যাক প্যানেলটি প্রতিটি শিশু উপাদানকে ধনাত্মক অনন্তের সাথে অক্ষের প্রতিবন্ধক হিসাবে পরিমিত করে যে এটি উপাদানগুলির সাথে স্ট্যাক করে king শিশু নিয়ন্ত্রণগুলি তাদের কতটা বড় হতে চায় তা ফিরিয়ে দিতে হবে (ধনাত্মক অনন্তটি কোনও অক্ষরেগনে মেজারঅভারাইড থেকে বৈধ প্রত্যাবর্তন নয় ) তাই তারা সর্বনিম্ন আকারে ফিরে আসে যেখানে সবকিছু ফিট হবে। তাদের সত্যিকার অর্থে কত স্থান পূরণ করতে হবে তা জানার উপায় নেই।

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

আপনি যদি পুরো জিনিসটি স্ক্রোল করতে সক্ষম হতে চান তবে আমি ভয় করি জিনিসগুলি কিছুটা আরও কঠিন হবে, কারণ স্ক্রোলভিউয়ার আপনাকে কাজ করার জন্য একটি অসীম পরিমাণ জায়গা দেয় যা আপনাকে শিশু উপাদানগুলির মতো একই অবস্থানে রাখবে you মূলত। এই পরিস্থিতিতে আপনি আপনার নতুন প্যানেলে একটি নতুন সম্পত্তি তৈরি করতে চাইতে পারেন যা আপনাকে ভিউপোর্টের আকার নির্দিষ্ট করতে দেয়, আপনার এটিকে স্ক্রোলভিউয়ার আকারের সাথে আবদ্ধ করতে সক্ষম হওয়া উচিত। আদর্শভাবে আপনি IScrolInfo প্রয়োগ করবেন , তবে আপনি যদি এগুলি সব সঠিকভাবে প্রয়োগ করতে চলেছেন তবে তা জটিল হয়ে উঠতে শুরু করে।


+1, আমি আপনাকে আরও দেবো তবে কেবলমাত্র 1 টি অনুমোদিত, আপনার প্রথম অনুচ্ছেদে অসংখ্য মাইক্রোসফ্ট পৃষ্ঠাগুলি কী ব্যর্থ হয়েছে তা নির্দেশ করেছে, অর্থাত কেন অনন্ততা উচ্চতা / প্রস্থ হিসাবে দেখা দিতে পারে এবং আপনি মেজারঅভারাইড থেকে উপলব্ধ সাইজে ফিরে আসার উপর নির্ভর করতে পারবেন না এই বিষয়টি সত্য ।
এডান

গ্রিডের ভিতরে একটি স্ট্যাকপ্যানেল তার বরং সাধারণ প্রয়োজনটি খুব সহজেই সমাধান করে। নীচের বিটটি যদি প্রয়োজন হয় তবে কোনও স্ক্রোলভিউয়ারের ভিতরে রাখা যেতে পারে। আমি ২০০ since সাল থেকে ডাব্লুপিএফ করছি এবং কেবলমাত্র একবার কাস্টম প্যানেল করার প্রয়োজন ছিল। আমি মনে করি না যে অতিরিক্ত জটিলতা উত্সাহিত করা এটি ভাল ধারণা।
ক্রিস বোর্দমান

@ ক্রিসবর্ডিয়ান আমি নিশ্চিত নই যে গ্রিডের ভিতরে থাকা স্ট্যাক প্যানেল কীভাবে সমস্যার সমাধান করে। উপলব্ধ স্থানটি পূরণ করার জন্য স্ট্যাক প্যানেলে এক বা একাধিক শিশু উপাদান রাখার ধারণা। একটি গ্রিডের মধ্যে স্ট্যাক প্যানেল স্থাপন করা কি এটি করে না?
কালেব ভেরি

61

একটি বিকল্প পদ্ধতি হ'ল একটি কলাম এবং এন সারি সহ গ্রিড ব্যবহার করা । সমস্ত সারি উচ্চতাতে Autoএবং নীচের সর্বাধিক সারি উচ্চতায় সেট করুন 1*

আমি এই পদ্ধতিটি পছন্দ করি কারণ আমি খুঁজে পেয়েছি গ্রিডের ডকপ্যানেলস, স্ট্যাকপ্যানেলস এবং র‌্যাপপ্যানেলের চেয়ে আরও ভাল লেআউট পারফরম্যান্স রয়েছে। তবে আপনি যদি না তাদের আইটেম টেম্পলেট ব্যবহার করেন (যেখানে লেআউটটি বিপুল সংখ্যক আইটেমের জন্য করা হচ্ছে) আপনি সম্ভবত লক্ষ্য করবেন না।


1
আমার জন্য সেরা সমাধান। এটির সাহায্যে আরও একটি বাড়ন্ত সারির আরও সংজ্ঞা দেওয়া সম্ভব
নিয়ু

18

আপনি স্পাইসিটাইকো.আউটো গ্রিড ব্যবহার করতে পারেন - এর একটি পরিবর্তিত সংস্করণ StackPanel:

<st:StackPanel Orientation="Horizontal" MarginBetweenChildren="10" Margin="10">
   <Button Content="Info" HorizontalAlignment="Left" st:StackPanel.Fill="Fill"/>
   <Button Content="Cancel"/>
   <Button Content="Save"/>
</st:StackPanel>

প্রথম বোতামটি পূরণ হবে।

আপনি এটি নিউগেটের মাধ্যমে ইনস্টল করতে পারেন:

Install-Package SpicyTaco.AutoGrid

আমি স্পাইসিটাকো.আউটো গ্রিডে একবার দেখার পরামর্শ দিই । এটা তোলে পরিবর্তে WPF মধ্যে রূপের জন্য খুব দরকারী DockPanel, StackPanelএবং Gridএবং খুব সহজ এবং অত্যন্ত শৃঙ্খলার প্রসারিত সঙ্গে সমস্যা সমাধানের জন্য। গিটহাবের রিডমিতে কেবল তাকান।

<st:AutoGrid Columns="160,*" ChildMargin="3">
    <Label Content="Name:"/>
    <TextBox/>

    <Label Content="E-Mail:"/>
    <TextBox/>

    <Label Content="Comment:"/>
    <TextBox/>
</st:AutoGrid>
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.