如何在xamarin/maui中获得页面内视图的位置?

ryhaxcpt  于 2022-12-07  发布在  其他
关注(0)|答案(1)|浏览(207)

我正在尝试创建一个列表视图选择器,并且希望列表视图在位于页面末尾时,在显示所选项的视图的顶部显示自身。如果列表视图位于页面末尾,则用户在单击所选项时将无法访问列表。

<?xml version="1.0" encoding="utf-8" ?>
<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Name="ComboBoxView"
             BindingContext="{x:Reference ComboBoxView}"
             x:Class="MauiApp1.ComboBoxNew">

    <Grid RowDefinitions="Auto,*" >
        <Frame HasShadow="False" Padding="5" CornerRadius="0" BorderColor="Gray" Grid.Row="0">
            <Grid Padding="5" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" ColumnDefinitions="75*,25*" >
                <Label Text="{Binding Source={Reference ComboBoxView}, Path=SelectedItem }" Grid.Column="0" HorizontalOptions="FillAndExpand" VerticalOptions="Fill" />
                <ImageButton Source="arrowdown" Grid.Column="1" HorizontalOptions="EndAndExpand" VerticalOptions="CenterAndExpand" HeightRequest="25" WidthRequest="25" ></ImageButton>
            </Grid>
            <Frame.GestureRecognizers>
                <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="OpenListItemsClickedEvent" />
            </Frame.GestureRecognizers>
        </Frame>
        <Grid Grid.Row="1" x:Name="ComboElementsList" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" RowDefinitions="Auto,*" >
            <Image Grid.Row="0" HeightRequest="15" WidthRequest="15" Source="arrowup" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" ></Image>
            <CollectionView Grid.Row="1" ItemsSource="{Binding Source={Reference ComboBoxView},Path=ItemSource}" Unfocused="ListUnfocusedEvent" x:Name="ComboListElements" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" HeightRequest="40" >
                <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <Frame CornerRadius="0" Padding="15" HasShadow="True" BorderColor="Gray">
                            <Label Text="{Binding .}" />
                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="ItemSelectedFromListViewEvent" CommandParameter="{Binding .}" />
                            </Frame.GestureRecognizers>
                        </Frame>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>
        </Grid>
    </Grid>
</ContentView>

using System.Collections.ObjectModel;

namespace MauiApp1;

public partial class ComboBoxNew : ContentView
{
    public ComboBoxNew()
    {
        InitializeComponent();
        ComboListElements.Opacity = 0;
        ComboElementsList.Opacity = 0;
    }

    protected override SizeRequest OnMeasure(double widthConstraint, double heightConstraint)
    {
        return base.OnMeasure(widthConstraint, heightConstraint);
    }

    public static readonly BindableProperty ItemSourceProperty = BindableProperty.Create("ItemSource", typeof(ObservableCollection<string>), typeof(ObservableCollection<string>), null, BindingMode.TwoWay, propertyChanged: ItemSourceChangedEvent);

    public ObservableCollection<string> ItemSource
    {
        get => (ObservableCollection<string>)GetValue(ItemSourceProperty);
        set => SetValue(ItemSourceProperty, value);
    }

    public static readonly BindableProperty SelectedItemProperty = BindableProperty.Create("SelectedItem", typeof(string), typeof(string), string.Empty, BindingMode.TwoWay);
    public string SelectedItem 
    {
        get => (string)GetValue(SelectedItemProperty);
        set => SetValue(SelectedItemProperty, value);
    }

    private void OpenListItemsClickedEvent(object sender, EventArgs e)
    {
        ComboListElements.FadeTo(1, 500, Easing.Linear);
        ComboElementsList.FadeTo(1, 500, Easing.Linear);
        var Xitem = ComboListElements.X;
        var Yitem = ComboListElements.Y;

    }

    private void ListUnfocusedEvent(object sender, FocusEventArgs e)
    {
        ComboListElements.FadeTo(0, 500, Easing.Linear);
        ComboElementsList.FadeTo(0, 500, Easing.Linear);
    }

    private void ItemSelectedFromListViewEvent(object sender, EventArgs e)
    {
        var clickedValue = ((e as TappedEventArgs).Parameter) as string;
        SelectedItem = clickedValue;
        ComboListElements.FadeTo(0, 500, Easing.Linear);
        ComboElementsList.FadeTo(0, 500, Easing.Linear);
    }

    private static void ItemSourceChangedEvent(BindableObject bindable, object oldValue, object newValue)
    {
        if (bindable is ComboBoxNew comboBoxNew && newValue != null && newValue is ObservableCollection<string> newItemSource) 
        {
            comboBoxNew.SelectedItem = newItemSource.FirstOrDefault();
        }
    }
}
lx0bsm1f

lx0bsm1f1#

我以为你想改变ComboBoxNew ContentView的位置。你可以在UI改变时设置它的翻译。就像下面的代码:

mycontrol.TranslationY = -100; //  other values could be set
    • ComboBoxNew ContentView**将上移并显示该项目。

希望对你有用。

相关问题