Question

所以我在XAML中有以下代码片段：

<TableView Intent="Settings">
   <TableRoot>
      <TableSection Title="Card Front Side">
         <ViewCell>
            <StackLayout x:Name="englishSide" Padding="20,0,20,0"
                         BackgroundColor="Red"
                         Orientation="Horizontal" VerticalOptions="Center">
               <Label Text="English" XAlign="Center"/>
               <Image x:Name="englishImage" Source="check.png" 
                      HorizontalOptions="EndAndExpand" IsVisible="false" />
            </StackLayout>
          </ViewCell>
       </TableSection>
   </TableRoot>
</TableView>

在我的C＃代码中，我有以下代码来处理点击事件：

englishSide.GestureRecognizers.Add(new TapGestureRecognizer
{
   NumberOfTapsRequired = 1,
   Command = new Command(() =>
   {
       englishImage.IsVisible = true;
       App.Database.UpdateSettings((int)Lang.English, "CardFrontSide");
   })
});

现在，当我点击该行时，我注意到它没有立即响应我的点击。然后我意识到可以应用轻敲事件的区域不占据行的整个高度，如下图所示（红色背景区域）。

任何人都可以让我知道如何在不改变ViewCell高度的情况下占据整行/ ViewCell高度？感谢

Answer 1

您的StackLayout的{{1}}设置为VerticalOptions，这意味着“在那边看到那个空间？只是到达中间的某个地方谢谢你 ”。
这意味着StackLayout不会占用超出需要的空间。

如果您希望"Center"填充单元格的高度（由StackLayout定义），则需要将其设置为ListView.RowHeight（您可以尝试不同的值，我'我不确定FillAndExpand或CenterAndExpand是否足够。

如果Fill不起作用，您可以将CenterAndExpand StackLayout与VerticalOptions="Center"包裹在另一个StackLayout FillAndExpand中，以便将文字垂直居中：

<TableView Intent="Settings">
   <TableRoot>
      <TableSection Title="Card Front Side">
         <ViewCell>
            <StackLayout VerticalOptions="FillAndExpand"
                         x:Name="englishSide"
                         Padding="20,0,20,0"
                         BackgroundColor="Red">
              <StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
                 <Label Text="English" XAlign="Center"/>
                 <Image x:Name="englishImage" Source="check.png" 
                        HorizontalOptions="EndAndExpand" IsVisible="false" />
              </StackLayout>
            </StackLayout>
          </ViewCell>
       </TableSection>
   </TableRoot>
</TableView>

如何扩展stacklayout的tap区域以占据视单元的高度？

1 个答案: