为什么水平滚动时第一个元素的边距不相同(*,0)? UWP muxc:ItemRepeater
Why the margin of the first elements are not the same(*, 0) when horizontal scrolling? UWP muxc:ItemRepeater
我以前 运行 UWP 代码是这样的:
在转发器页面中
<muxc:ItemsRepeaterScrollHost Grid.Row="1">
<ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollMode="Disabled">
<muxc:ItemsRepeater ItemsSource="{x:Bind ViewModel.Items, Mode=OneWay}">
<muxc:ItemsRepeater.Layout>
<muxc:StackLayout Orientation="Horizontal" Spacing="8" />
</muxc:ItemsRepeater.Layout>
<DataTemplate x:DataType="item:RepoListItem">
<Grid>
<block:RepoButtonBlock
x:Name="RepositoryBlock"
Width="250"
Height="{Binding ScrollViewer.Height}"
VerticalAlignment="Stretch"
DisplayStarButton="False"
RepositoryId="{x:Bind RepoId, Mode=OneWay}" />
</Grid>
</DataTemplate>
</muxc:ItemsRepeater>
</ScrollViewer>
</muxc:ItemsRepeaterScrollHost>
ViewModel.Items:
public ObservableCollection<RepoListItem> PinnedRepos { get; private set; } = new();
RepoListItem:
public class RepoListItem
{
public long RepoId { get; set; }
public Repository Repository { get; set; }
}
block:RepoButtonBlock 用户控件
<Grid>
<Button
x:Name="RepoBlockButton"
Margin="0,3,0,0"
Padding="18,12"
Click="RepoBlockButton_Click"
Style="{StaticResource ContentBlockButtonStyle}">
....
</Button>
</Grid>
block:RepoButtonBlock
的高度因按钮内的控件而异。我将 VerticalAlignment 设置为 Stretch,因为它水平滚动并且高度必须相同。但是,只有第一个滚动并消失的中继器会将元素高度减小到其实际大小并固定在下方。我有什么想法。这个问题有解决办法吗?
滚动前:
https://i.stack.imgur.com/NsXPJ.png
滚动到最后:
https://i.stack.imgur.com/spxIV.png
回到第一个元素:
https://i.stack.imgur.com/OO777.png
展示这段代码涉及的代码非常庞大,无法展示其中的一部分。
因此,我固定了高度并将TextTrimming="CharacterEllipsis"
设置为UserControl中的TextBlock。所以我修复了一部分。
我以前 运行 UWP 代码是这样的:
在转发器页面中
<muxc:ItemsRepeaterScrollHost Grid.Row="1">
<ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollMode="Disabled">
<muxc:ItemsRepeater ItemsSource="{x:Bind ViewModel.Items, Mode=OneWay}">
<muxc:ItemsRepeater.Layout>
<muxc:StackLayout Orientation="Horizontal" Spacing="8" />
</muxc:ItemsRepeater.Layout>
<DataTemplate x:DataType="item:RepoListItem">
<Grid>
<block:RepoButtonBlock
x:Name="RepositoryBlock"
Width="250"
Height="{Binding ScrollViewer.Height}"
VerticalAlignment="Stretch"
DisplayStarButton="False"
RepositoryId="{x:Bind RepoId, Mode=OneWay}" />
</Grid>
</DataTemplate>
</muxc:ItemsRepeater>
</ScrollViewer>
</muxc:ItemsRepeaterScrollHost>
ViewModel.Items:
public ObservableCollection<RepoListItem> PinnedRepos { get; private set; } = new();
RepoListItem:
public class RepoListItem
{
public long RepoId { get; set; }
public Repository Repository { get; set; }
}
block:RepoButtonBlock 用户控件
<Grid>
<Button
x:Name="RepoBlockButton"
Margin="0,3,0,0"
Padding="18,12"
Click="RepoBlockButton_Click"
Style="{StaticResource ContentBlockButtonStyle}">
....
</Button>
</Grid>
block:RepoButtonBlock
的高度因按钮内的控件而异。我将 VerticalAlignment 设置为 Stretch,因为它水平滚动并且高度必须相同。但是,只有第一个滚动并消失的中继器会将元素高度减小到其实际大小并固定在下方。我有什么想法。这个问题有解决办法吗?
滚动前:
https://i.stack.imgur.com/NsXPJ.png
滚动到最后:
https://i.stack.imgur.com/spxIV.png
回到第一个元素:
https://i.stack.imgur.com/OO777.png
展示这段代码涉及的代码非常庞大,无法展示其中的一部分。
因此,我固定了高度并将TextTrimming="CharacterEllipsis"
设置为UserControl中的TextBlock。所以我修复了一部分。