How can I remove the space between the GroupHeaderTemplate and the ItemTemplate in a CollectionView on Windows .NET MAUI

huangapple go评论54阅读模式
英文:

How can I remove the space between the GroupHeaderTemplate and the ItemTemplate in a CollectionView on Windows .NET MAUI

问题

Here's the translated content:

"在没有得到答案的情况下,我重新提出我想要解决的问题。我正在.NET MAUI中开发一个联系人列表。然而,我的GroupHeaderTemplate周围有填充。这个问题只发生在Windows上。正如你所看到的,我在Android上没有这个问题。

以下是在Android和Windows上的结果。

Android:
How can I remove the space between the GroupHeaderTemplate and the ItemTemplate in a CollectionView on Windows .NET MAUI

Windows:
How can I remove the space between the GroupHeaderTemplate and the ItemTemplate in a CollectionView on Windows .NET MAUI


<CollectionView Grid.Row="2"
                ItemsSource="{Binding Contacts}"
                SelectionMode="None"
                HorizontalOptions="FillAndExpand"
                VerticalOptions="FillAndExpand"
                VerticalScrollBarVisibility="Always"    
                IsGrouped="True">
    
    <!-- 群组头部 -->
    <CollectionView.GroupHeaderTemplate>
        <DataTemplate>
            <Label Text="{Binding Name}" 
                   FontSize="12" HeightRequest="20"
                   FontFamily="{x:Static constants:FontFamilies.TEXT_BOLD}"
                   BackgroundColor="{StaticResource HeaderGrey}"
                   Padding="20,0,0,4" VerticalTextAlignment="Center"
                   HorizontalOptions="FillAndExpand"/>
        </DataTemplate>
    </CollectionView.GroupHeaderTemplate>

    <CollectionView.ItemTemplate>
        <DataTemplate x:DataType="models:Contact">
            <VerticalStackLayout>
   
                <Label HeightRequest="39"
                       VerticalTextAlignment="Center"
                       Padding="20,0,0,0">

                    <Label.FormattedText>
                        <FormattedString>
                            <Span Text="{Binding Firstname}"/>
                            <Span Text=" "/>
                            <Span Text="{Binding Name}"
                                  FontFamily="{x:Static constants:FontFamilies.TEXT_BOLD}"/>
                        </FormattedString>
                    </Label.FormattedText>

                    <Label.GestureRecognizers>
                        <TapGestureRecognizer Tapped="ContactSelected" 
                                              Command="{Binding Source=
                                                                {RelativeSource AncestorType={x:Type local:ContactViewModel}}, 
                                                                                                Path=DisplayContactCommand}"
                                              CommandParameter="{Binding Id}"/>
                    </Label.GestureRecognizers>
                </Label>

                <BoxView HeightRequest="1" BackgroundColor="{StaticResource SeparatorCellGrey}"/>

            </VerticalStackLayout>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

我尝试了一切。也许有一个需要修改以适应Windows平台的处理程序,但我找不到它。希望能解决这个困扰我很长时间的问题。"

英文:

Having not had an answer to my question, I am relaunching the subject for which I would like to have the solution. I am developing a contact list in .NET MAUI. However I have padding that goes around my GroupHeaderTemplate. This issue only occurs on Windows. As you can see I don't have this problem on Android.

Here is the result on Android and Windows.

Android :
How can I remove the space between the GroupHeaderTemplate and the ItemTemplate in a CollectionView on Windows .NET MAUI

Windows :
How can I remove the space between the GroupHeaderTemplate and the ItemTemplate in a CollectionView on Windows .NET MAUI


                &lt;CollectionView Grid.Row=&quot;2&quot;
                                ItemsSource=&quot;{Binding Contacts}&quot;
                                SelectionMode=&quot;None&quot;
                                HorizontalOptions=&quot;FillAndExpand&quot;
                                VerticalOptions=&quot;FillAndExpand&quot;
                                VerticalScrollBarVisibility=&quot;Always&quot;    
                                IsGrouped=&quot;True&quot;&gt;
                    
                    &lt;!-- En-t&#234;te de groupe --&gt;
                    &lt;CollectionView.GroupHeaderTemplate&gt;
                        &lt;DataTemplate&gt;
                            &lt;Label Text=&quot;{Binding Name}&quot; 
                                   FontSize=&quot;12&quot; HeightRequest=&quot;20&quot;
                                   FontFamily=&quot;{x:Static constants:FontFamilies.TEXT_BOLD}&quot;
                                   BackgroundColor=&quot;{StaticResource HeaderGrey}&quot;
                                   Padding=&quot;20,0,0,4&quot; VerticalTextAlignment=&quot;Center&quot;
                                   HorizontalOptions=&quot;FillAndExpand&quot;/&gt;
                        &lt;/DataTemplate&gt;
                    &lt;/CollectionView.GroupHeaderTemplate&gt;

                    &lt;CollectionView.ItemTemplate&gt;
                        &lt;DataTemplate x:DataType=&quot;models:Contact&quot;&gt;
                            &lt;VerticalStackLayout&gt;
   
                                &lt;Label HeightRequest=&quot;39&quot;
                                       VerticalTextAlignment=&quot;Center&quot;
                                       Padding=&quot;20,0,0,0&quot;&gt;

                                    &lt;Label.FormattedText&gt;
                                        &lt;FormattedString&gt;
                                            &lt;Span Text=&quot;{Binding Firstname}&quot;/&gt;
                                            &lt;Span Text=&quot; &quot;/&gt;
                                            &lt;Span Text=&quot;{Binding Name}&quot;
                                                  FontFamily=&quot;{x:Static constants:FontFamilies.TEXT_BOLD}&quot;/&gt;
                                        &lt;/FormattedString&gt;
                                    &lt;/Label.FormattedText&gt;

                                    &lt;Label.GestureRecognizers&gt;
                                        &lt;TapGestureRecognizer Tapped=&quot;ContactSelected&quot; 
                                                              Command=&quot;{Binding Source=
                                                                                    {RelativeSource AncestorType={x:Type local:ContactViewModel}}, 
                                                                                                    Path=DisplayContactCommand}&quot;
                                                              CommandParameter=&quot;{Binding Id}&quot;/&gt;
                                    &lt;/Label.GestureRecognizers&gt;
                                &lt;/Label&gt;

                                &lt;BoxView HeightRequest=&quot;1&quot; BackgroundColor=&quot;{StaticResource SeparatorCellGrey}&quot;/&gt;

                            &lt;/VerticalStackLayout&gt;
                        &lt;/DataTemplate&gt;
                    &lt;/CollectionView.ItemTemplate&gt;
                &lt;/CollectionView&gt;

I have tried everything. Maybe there is a handler to modify for Windows platform but I can't find it. Hoping to have a solution for this problem that I have had for a long time.

答案1

得分: 1

是的,就像您所说的那样。

我在我的一侧进行了测试。结果是,在Windows上,默认情况下有一个最小高度,即使我们将Label的高度设置得非常小,CollectionView.GroupHeaderTemplate仍然占据默认的最小高度。我们可以增加GroupHeader的高度,但在尝试减小GroupHeader的高度后,我们发现其高度在达到最小高度后不能再变小。

正如您所说,在Android上一切正常。

关于Windows上的这个问题,您可以在这里创建一个新的问题。

非常感谢您对maui的支持和反馈。

最好的问候!

杰西

英文:

Yes, it is just the case as you said.

I did a test on my side. The result is that on windows, there is a minimum height by default, even if we set the Label height very small, CollectionView.GroupHeaderTemplate still occupies the default minimum height. We can increase the height of the GroupHeader, but after trying to reduce the height of the GroupHeader, we find that its height cannot be smaller after reaching the minimum height.

And as you said, on Android, everything works fine.

For this problem on windows, you can create a new issue here.

Thanks very much for your support for maui and feedback.

Best regards!

Jessie

huangapple
  • 本文由 发表于 2023年4月13日 21:02:40
  • 转载请务必保留本文链接:https://go.coder-hub.com/76005768.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定