Динамическое изменение ширины изображения внутри таблицы данных с помощью ползунка - PullRequest
Новая
       11

Динамическое изменение ширины изображения внутри таблицы данных с помощью ползунка

0 голосов
/ 30 октября 2019

Я заполнил Listview с изображениями, и я хочу динамически изменять размер изображений с помощью ползунка. Я не мог найти никакого решения пока. Как я могу это сделать? 

        <ListView ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Disabled" Width="{Binding ElementName=Windowdefault, Path=ActualWidth}" Margin="5" MouseDoubleClick="TvBox_MouseDoubleClick" x:Name="TvBox"  VerticalAlignment="Top">
        <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Wrapalign:AlignableWrapPanel HorizontalContentAlignment="Center" HorizontalAlignment="Center" ScrollViewer.HorizontalScrollBarVisibility="Disabled"    />
                </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate>                  
                <StackPanel x:Name="stack"  Margin="0 0 0 0" Orientation="Vertical" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                    <StackPanel Margin="-25 -8 -25 -5">
                        <Image  Width="100" x:Name="ImagesGrid"  Source="{Binding ID,Converter={StaticResource ImagePathConverter}}" HorizontalAlignment="Stretch" VerticalAlignment="Top" Stretch="UniformToFill" />
                        <TextBlock x:Name="ID" HorizontalAlignment="Center" FontWeight="Light" Text="{Binding ID}"  VerticalAlignment="Bottom" />
                    </StackPanel>
                    <TextBlock Visibility="Collapsed"  x:Name="Flname" MaxWidth="60" TextAlignment="Center" FontSize="7" TextWrapping="Wrap" HorizontalAlignment="Center" FontWeight="Light" Text="{Binding Name}"  VerticalAlignment="Bottom" />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>

1 Ответ

0 голосов
/ 01 ноября 2019

Это довольно просто сделать.

Используя ваш код в качестве отправной точки, я добавил Slider с x:Name="Slider". В DataTemplate я установил привязку к Image, чтобы она была Value из Slider.

. Slider имеет Minimum="100" и Maximum="1000" для примера. 

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Slider x:Name="Slider"
        Grid.Row="0"
        Interval="1"
        Maximum="1000"
        Minimum="100"
        Value="100" />
    <ListView
        Grid.Row="1"
        Margin="5"
        VerticalAlignment="Top"
        ItemsSource="{Binding Images}"
        ScrollViewer.HorizontalScrollBarVisibility="Disabled"
        ScrollViewer.VerticalScrollBarVisibility="Auto">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel
                    Margin="0"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    Orientation="Vertical">
                    <StackPanel>
                        <Image x:Name="ImagesGrid"
                            Width="{Binding ElementName=Slider, Path=Value}"
                            HorizontalAlignment="Stretch"
                            VerticalAlignment="Top"
                            Source="{Binding Image}"
                            Stretch="UniformToFill" />
                        <TextBlock x:Name="ID"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Bottom"
                            FontWeight="Light"
                            Text="{Binding Name}" />
                    </StackPanel>
                    <TextBlock
                        MaxWidth="60"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Bottom"
                        FontSize="7"
                        FontWeight="Light"
                        Text="{Binding FileName}"
                        TextAlignment="Center"
                        TextWrapping="Wrap"
                        Visibility="Collapsed" />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

Надеюсь, это поможет!

...