我对 MAUI 应用程序相当陌生,我拥有的是绑定到学生集合的 CarouselView。一切工作正常,但是我有一个似乎很普遍的问题 - 我有一个“下一个”和“上一个”按钮,我想用它们从轮播中的一个项目导航到下一个项目。 “上一个”按钮工作正常,但“下一个”按钮的行为不符合预期。例如,如果我的集合中有 3 个学生,我就无法顺利地从学生 1(位置 0)导航到学生 2(位置 1)。我必须单击“下一步”按钮两次,只有在第三次单击时,它才最终移动到学生 2。它不断重置回学生 1。我在调试模式下监视了行为,我可以看到预览中的当前项目确实当我调试 NextButton_Clicked 方法时确实发生了变化,但是一旦调试退出该方法,CurrentItem 就会重置回学生 1(位置 0)。正如我所提到的,我的 Students 集合工作正常,数据符合预期,并且我没有任何其他(可见)触发器可能会覆盖 CurrentItem 更改。作为参考,我在代码隐藏中的方法如下;
private void NextButton_Clicked(object sender, EventArgs e)
{
if (StudentCarousel.ItemsSource is IList<Student> students)
{
int studentCount = students.Count;
int nextPosition = (CurrentPosition + 1) % studentCount;
Debug.WriteLine($"NextButton_Clicked: Setting Position to {nextPosition}");
// Update Position before CurrentItem
CurrentPosition = nextPosition;
StudentCarousel_CurrentItem = students[nextPosition];
}
}
private void StudentCarousel_PositionChanged(object sender, PositionChangedEventArgs e)
{
Debug.WriteLine($"PositionChanged Event: New Position = {e.CurrentPosition}");
}
private void CarouselView_CurrentItemChanged(System.Object sender, Microsoft.Maui.Controls.CurrentItemChangedEventArgs e)
{
if (e.CurrentItem is Student currentStudent)
{
CurrentItem = currentStudent;
}
}
我还有以下内容;
public ObservableCollection<Student> Students { get; set; } = new ObservableCollection<Student>();
private int _currentPosition;
public int CurrentPosition
{
get => _currentPosition;
set
{
if (_currentPosition != value)
{
_currentPosition = value;
OnPropertyChanged(nameof(CurrentPosition));
Debug.WriteLine($"CurrentPosition set to: {_currentPosition}");
}
}
}
private Student _studentCarousel_CurrentItem;
public Student StudentCarousel_CurrentItem
{
get => _studentCarousel_CurrentItem;
set
{
if (_studentCarousel_CurrentItem != value)
{
_studentCarousel_CurrentItem = value;
OnPropertyChanged(nameof(StudentCarousel_CurrentItem));
}
}
}
下面是.xaml代码;
<Frame Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="1" Margin="5" BorderColor="Gray" BackgroundColor="White" HasShadow="True" HeightRequest="250" WidthRequest="300"
HorizontalOptions="Center" VerticalOptions="Center">
<StackLayout Orientation="Vertical" HorizontalOptions="Center" VerticalOptions="Center" Padding="10">
<!-- CarouselView -->
<RefreshView>
<CarouselView x:Name="StudentCarousel" ItemsSource="{Binding Students}" Loop="True"
HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
HeightRequest="250" WidthRequest="300" IndicatorView="CarouselIndicator" IsScrollAnimated="True" CurrentItem="{Binding StudentCarousel_CurrentItem, Mode=TwoWay}" CurrentItemChanged="CarouselView_CurrentItemChanged" Position="{Binding CurrentPosition, Mode=TwoWay}" PositionChanged="StudentCarousel_PositionChanged" >
<CarouselView.ItemTemplate>
<DataTemplate>
<Grid Padding="10" RowSpacing="5" ColumnSpacing="10" HorizontalOptions="Center" VerticalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<!-- Image -->
<Image Source="student_icon.png" Grid.Row="0" Grid.Column="0" HeightRequest="40" WidthRequest="40" HorizontalOptions="Center" />
<!-- Label: Student Info -->
<Label Text="Student Info" Grid.Row="1" Grid.Column="0" FontAttributes="Bold" FontSize="Small" HorizontalOptions="Center" VerticalOptions="Center" />
<!-- Label: Full Name -->
<Label Grid.Row="2" Grid.Column="0" HorizontalOptions="Start" VerticalOptions="Center">
<Label.FormattedText>
<FormattedString>
<Span Text="FullName: " FontAttributes="Bold" />
<Span Text="{Binding FullNameWithMiddleName}" />
</FormattedString>
</Label.FormattedText>
</Label>
</Grid>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
</RefreshView>
<!-- Navigation Buttons -->
<StackLayout Orientation="Horizontal" HorizontalOptions="Center" Margin="0,10,0,0">
<Button x:Name="PreviousButton" Text="Previous" Clicked="PreviousButton_Clicked" />
<Button x:Name="NextButton" Text="Next" Clicked="NextButton_Clicked" Margin="10,0,0,0" />
</StackLayout>
</StackLayout>
</Frame>
我完全陷入困境,不知道我哪里出了问题。任何建议表示赞赏。
这是我的解决方案。我删除了 currentItem 并将其更改为 Student_CurrentItem。
private void CarouselView_CurrentItemChanged(System.Object sender, Microsoft.Maui.Controls.CurrentItemChangedEventArgs e)
{
if (e.CurrentItem is Student currentStudent)
{
Student_CurrentItem = currentStudent;
}
}