Элементы перекрывают друг друга

@Grawerman · Регистрация: 17.03.2014

Author24 — интернет-сервис помощи студентам

есть DockPanel в ней 3 элемента Image StackPanel Image. При уменьшении окна StacPanel перекрывается Image'ами а Image друг другом не перекрываются. Я хочу чтобы ни один из элементов не мог перекрыть другой. Установил каждому минимальные значения ширины 256, но проблема по прежнему осталась.

C#

  
<Image DockPanel.Dock="Left"   Source="C:\Users\ryjenkov\Desktop\Новая папка\IMAGES\1 floor1.png" MinWidth="256" />
<Image  DockPanel.Dock="Right"    Source="C:\Users\ryjenkov\Desktop\Новая папка\IMAGES\1 floor1.png" HorizontalAlignment="Right" MinWidth="256" />
 
 
<StackPanel  DockPanel.Dock="Top" x:Name="StackPanel1" Height="296"  MinWidth="256">
...
  </StackPanel>

@Spawn · 21.04.2014, 15:05

Либо Ваши элементы должны менять свой размер, либо запрещайте делать форму меньше определённого размера...

Добавлено через 39 секунд
Первый вариант правильнее с точки зрения "резинового" интерфейса, который присущ WPF приложениям

@Grawerman · 21.04.2014, 15:08 **[ТС]**

Изменение размера как можно реализовать? Правый Image меняет свой размер( в то время как левый нет), и при этом не закрывает Image а вот StackPanel он закрывает(когда тяну за правую сторону окна).

@Spawn · 21.04.2014, 15:12

Настолько ли Вам сдался DockPanel? Как я понимаю, тут табличка из 2-х колонок и 2-х строчек, из которых верхняя строка объединённая, куда уместнее будет Grid использовать.

@Grawerman · 21.04.2014, 15:22 **[ТС]**

Немного не понял о чем вы.
Если Вы про весь интерфейс то он у меня состоит из Grid в котором 2 строчки. В верхней строчке вставлена Dockpanel в котором 3 элемента. Использую DockPanel потому что хочу избежать пустого места(визуально серых прямоугольников). А если использовать Grid то не получится сделать 3 колонки с плавающими полями.

@Spawn · 21.04.2014, 15:56

Сообщение от Grawerman

А если использовать Grid то не получится сделать 3 колонки с плавающими полями.

Так, Вам нужно 3 колонки, где центральная часть, допустим, как некая менюшка...

XML

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Image Grid.Column="0" Source="left.png" />
        <Image Grid.Column="2" Source="right.png" />
        <StackPanel Grid.Column="1">
            <Button Content="button1" />
            <Button Content="button1" />
            <Button Content="button1" />
            <Button Content="button1" />
        </StackPanel>
    </Grid>

@Grawerman · 21.04.2014, 16:23 **[ТС]**

XML

<Grid  Grid.Row="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition MinWidth="160" MaxWidth="160"/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Image Grid.Column="0"    Source="C:\Users\ryjenkov\Desktop\Новая папка\IMAGES\1 floor1.png" />
            <StackPanel Grid.Column="1" x:Name="StackPanel1" Height="350" Margin="0,3,0,0" VerticalAlignment="Top" HorizontalAlignment="Center" MinWidth="160" >
 
                <Image Source="C:\Users\ryjenkov\Desktop\Новая папка\Выставка\1920x1080\IMAGES\power_gr.png" Height="63" Width="159" VerticalAlignment="Top" />
                <Label HorizontalContentAlignment="Center" Content="16:40" VerticalAlignment="Top" FontSize="20"/>
                <Label HorizontalContentAlignment="Center" Content="12 Марта" VerticalAlignment="Top" FontSize="20"/>
                <!--Region Переключение Картинок -->
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Top">
                    <Button DockPanel.Dock="Left" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" HorizontalAlignment="Left" MinWidth="30" MinHeight="30" Click="Button_Click">
                        <Button.Foreground>
                            <ImageBrush ImageSource="C:\Users\ryjenkov\Desktop\Новая папка\Выставка\1920x1080\IMAGES\left.png"/>
                        </Button.Foreground>
                    </Button>
                    <Label Content="Ручной" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" FontSize="20"/>
                    <Button   HorizontalContentAlignment="Center" VerticalContentAlignment="Center" HorizontalAlignment="Right" MinWidth="30" MinHeight="30" RenderTransformOrigin="6.816,0.191" Click="Button_Click_1">
                        <Button.Foreground>
                            <ImageBrush ImageSource="C:\Users\ryjenkov\Desktop\Новая папка\Выставка\1920x1080\IMAGES\left_Gray.png"/>
                        </Button.Foreground>
                    </Button>
 
                </StackPanel>
                <!--Endregion-->
                <DockPanel ScrollViewer.CanContentScroll="True" Height="43">
                    <Image x:Name="Alarm" DockPanel.Dock="Left" Source="C:\Users\ryjenkov\Desktop\Новая папка\Выставка\1920x1080\IMAGES\1394430259_iwarning.png"   />
                    <Label DockPanel.Dock="Right" Content="Авария" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" FontSize="20" HorizontalAlignment="Left" />
                </DockPanel>
 
            </StackPanel>
            <Image Grid.Column="3" DockPanel.Dock="Right"  Margin="0,0,0,0"  Source="C:\Users\ryjenkov\Desktop\Новая папка\IMAGES\1 floor1.png" />
 
        </Grid>

То что нужно. Спасибо.

Может еще подскажите как сделать кнопку по центру с учетом того что она не лижет в таблице и должна масштабироваться вместе с окном?

@Spawn · 21.04.2014, 16:27

Внутри StackPanel с масштабированием всё довольно печально... либо будет хитрая система Binding, либо проще пересмотреть необходимость класть кнопку в эту панель.

@Grawerman · 21.04.2014, 16:42 **[ТС]**

Немного не поняли меня. Выше представленный код это то что лежит в таблице из 2 строк в 0 строке. Есть еще TabControl который лежит в 1 строке. И вот поверх этой таблицы должна быть хитрющая круговая система кнопок которую в коде я уже сделал, осталось только поместить кнопку в центр экрана так чтобы она масштабировалась.

@Spawn · 21.04.2014, 17:07

Делаем глобальный Grid, кладём обе существующих таблицы в него. тот, что будет вторым, окажется поверх предыдущей таблицы (ну или Panel.ZIndex ещё есть свойство)

XML

<Grid>
        <Grid>
            <Button Content="Кнопка 1" FontSize="50" />
        </Grid>
        <Grid Opacity=".5">
            <TextBox Text="Текстовое поле" FontSize="50" />
        </Grid>
    </Grid>

За полупрозрачным гридом с текстовым полем виден грид с кнопкой...

Добавлено через 14 секунд
Делаем глобальный Grid, кладём обе существующих таблицы в него. тот, что будет вторым, окажется поверх предыдущей таблицы (ну или Panel.ZIndex ещё есть свойство)

XML

<Grid>
        <Grid>
            <Button Content="Кнопка 1" FontSize="50" />
        </Grid>
        <Grid Opacity=".5">
            <TextBox Text="Текстовое поле" FontSize="50" />
        </Grid>
    </Grid>

За полупрозрачным гридом с текстовым полем виден грид с кнопкой...

@Grawerman · 21.04.2014, 17:36 **[ТС]**

Хм, я кажется начинаю понимать шутки про магию, когда я так пытался сделать у меня вылезала ошибка о том что Window не может содержать больше одного Grid.

@tezaurismosis · 22.04.2014, 12:36

Сообщение от Grawerman

Window не может содержать больше одного Grid

В окне - только один Grid, а в нём - другие, причём сколько угодно. Не забудьте прописать определения строк и столбцов.
Проверьте расположение элементов друг относительно друга.

@Grawerman 0 / 0 / 0 Регистрация: 17.03.2014 Сообщений: 50
	21.04.2014, 17:36 [ТС]	11
	Хм, я кажется начинаю понимать шутки про магию, когда я так пытался сделать у меня вылезала ошибка о том что Window не может содержать больше одного Grid. 0

@Spawn 995 / 893 / 354 Регистрация: 24.03.2014 Сообщений: 2,381 Записей в блоге: 2
	21.04.2014, 15:05	2
	Либо Ваши элементы должны менять свой размер, либо запрещайте делать форму меньше определённого размера... Добавлено через 39 секунд Первый вариант правильнее с точки зрения "резинового" интерфейса, который присущ WPF приложениям 1

@Grawerman 0 / 0 / 0 Регистрация: 17.03.2014 Сообщений: 50
	21.04.2014, 15:08 [ТС]	3
	Изменение размера как можно реализовать? Правый Image меняет свой размер( в то время как левый нет), и при этом не закрывает Image а вот StackPanel он закрывает(когда тяну за правую сторону окна). 0

@Spawn 995 / 893 / 354 Регистрация: 24.03.2014 Сообщений: 2,381 Записей в блоге: 2
	21.04.2014, 15:12	4
	Настолько ли Вам сдался DockPanel? Как я понимаю, тут табличка из 2-х колонок и 2-х строчек, из которых верхняя строка объединённая, куда уместнее будет Grid использовать. 1

@Grawerman 0 / 0 / 0 Регистрация: 17.03.2014 Сообщений: 50
	21.04.2014, 15:22 [ТС]	5
	Немного не понял о чем вы. Если Вы про весь интерфейс то он у меня состоит из Grid в котором 2 строчки. В верхней строчке вставлена Dockpanel в котором 3 элемента. Использую DockPanel потому что хочу избежать пустого места(визуально серых прямоугольников). А если использовать Grid то не получится сделать 3 колонки с плавающими полями. 0

@Spawn 995 / 893 / 354 Регистрация: 24.03.2014 Сообщений: 2,381 Записей в блоге: 2
	21.04.2014, 16:27	8
	Внутри StackPanel с масштабированием всё довольно печально... либо будет хитрая система Binding, либо проще пересмотреть необходимость класть кнопку в эту панель. 1

@Grawerman 0 / 0 / 0 Регистрация: 17.03.2014 Сообщений: 50
	21.04.2014, 16:42 [ТС]	9
	Немного не поняли меня. Выше представленный код это то что лежит в таблице из 2 строк в 0 строке. Есть еще TabControl который лежит в 1 строке. И вот поверх этой таблицы должна быть хитрющая круговая система кнопок которую в коде я уже сделал, осталось только поместить кнопку в центр экрана так чтобы она масштабировалась. 0

@tezaurismosis Администратор 9602 / 4744 / 761 Регистрация: 17.04.2012 Сообщений: 9,592 Записей в блоге: 14
	22.04.2014, 12:36	12
	Сообщение от Grawerman Window не может содержать больше одного Grid В окне - только один Grid, а в нём - другие, причём сколько угодно. Не забудьте прописать определения строк и столбцов. Проверьте расположение элементов друг относительно друга. 0

Элементы перекрывают друг друга

Решение