如何在Xamarin Forms的ListView中引用自定义Slider组件

核心原因 #

ListView的ItemTemplate是模板化布局，每个列表项都是运行时动态生成的控件实例，不属于页面的直接可视化树，因此无法通过后台代码直接用x:Name引用这些控件——这和单个控件直接放在页面上的场景完全不同。你之前尝试的listView.FindByName只会查找ListView本身的子控件，找不到模板里的控件，而且强转成SKCanvasView也不对，应该用你自定义的BalloonSlider类型。

解决方案（按推荐优先级排序） #

1. 用数据绑定（推荐，符合MVVM设计）

自定义Slider的核心需求无非是读取/修改数值，完全可以通过数据绑定实现，不需要直接操作控件：

• 定义列表项的ViewModel类：

  public class SliderItemViewModel : INotifyPropertyChanged
  {
      private double _sliderValue;
      public string ItemText { get; set; }
      public double SliderValue
      {
          get => _sliderValue;
          set
          {
              _sliderValue = value;
              OnPropertyChanged();
          }
      }
  
      public event PropertyChangedEventHandler PropertyChanged;
      private void OnPropertyChanged([CallerMemberName] string propertyName = null)
      {
          PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
      }
  }
  

• 在XAML的ItemTemplate里给自定义Slider绑定SliderValue属性：

  <ListView ItemsSource="{Binding SliderItems}">
      <ListView.ItemTemplate>
          <DataTemplate>
              <ViewCell>
                  <Grid>
                      <!-- 左上文本 -->
                      <Label Grid.Row="0" Grid.Column="0" Text="{Binding ItemText}" />
                      <!-- 左下自定义Slider -->
                      <local:BalloonSlider Grid.Row="1" Grid.Column="0" x:Name="balloon_slider" 
                                          Value="{Binding SliderValue, Mode=TwoWay}" />
                      <!-- 右侧数值 -->
                      <Label Grid.Row="0" Grid.RowSpan="2" Grid.Column="1" Text="{Binding SliderValue, StringFormat='{0:F1}'}" />
                  </Grid>
              </ViewCell>
          </DataTemplate>
      </ListView.ItemTemplate>
  </ListView>
  

• 后台只需要操作SliderItems集合里的ViewModel对象，就能同步Slider的数值，不需要直接引用控件。

2. 直接操作控件（仅适用于必须调用控件方法的场景）

如果确实需要直接操作Slider控件（比如调用自定义方法、绑定控件专属事件），可以通过ListView.ItemAppearing事件获取每个Item里的控件：

• 在XAML里给ListView绑定ItemAppearing事件：

  <ListView ItemsSource="{Binding SliderItems}" ItemAppearing="ListView_ItemAppearing" />
  

• 后台事件处理代码：

  private void ListView_ItemAppearing(object sender, ItemVisibilityEventArgs e)
  {
      // 获取当前列表项的ViewCell
      if (e.Item is ViewCell cell)
      {
          // 查找自定义Slider，注意用你自己的控件类型
          var balloonSlider = cell.FindByName<BalloonSlider>("balloon_slider");
          if (balloonSlider != null)
          {
              // 这里可以绑定控件事件或执行自定义逻辑
              balloonSlider.ValueChanged += BalloonSlider_ValueChanged;
          }
      }
  }
  
  // 记得在ItemDisappearing里解绑事件，避免内存泄漏
  private void ListView_ItemDisappearing(object sender, ItemVisibilityEventArgs e)
  {
      if (e.Item is ViewCell cell)
      {
          var balloonSlider = cell.FindByName<BalloonSlider>("balloon_slider");
          if (balloonSlider != null)
          {
              balloonSlider.ValueChanged -= BalloonSlider_ValueChanged;
          }
      }
  }
  
  private void BalloonSlider_ValueChanged(object sender, ValueChangedEventArgs e)
  {
      // 处理Slider数值变化逻辑
      var slider = sender as BalloonSlider;
      if (slider != null)
      {
          // 这里可以获取或设置slider的属性
      }
  }
  

3. 排查自定义控件的x:Name和类型

• 确保ItemTemplate里的自定义Slider正确设置了x:Name="balloon_slider"，且控件的XML命名空间（比如local:）指向你的自定义控件所在的程序集。
• 不要强转成SKCanvasView，因为你的BalloonSlider是基于SKCanvasView封装的自定义控件，应该用你自己定义的控件类型进行强转。

内容的提问来源于stack exchange，提问作者Monsi