Xamarin.Forms UWP-如何隐藏或更改Picker/ComboBox的颜色下拉箭头

本文介绍了Xamarin.Forms UWP-如何隐藏或更改Picker/ComboBox的颜色下拉箭头的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我现在正在为UWP开发Xamarin.Forms项目，并且正在为Pickers使用自定义渲染器.我实际上是将选择器覆盖在标签和图标的顶部，以便当用户单击标签/图标时，它会打开选择器.为了实现这一点，我基本上将选择器上的所有内容都设置为透明-边框，文本和背景.选择器仍然可以正常运行，并且所有选择器元素都不可见，选择器箭头仍然可见.我如何影响选择器箭头的颜色(以使其透明)，还是完全摆脱它?

I'm working on a Xamarin.Forms project for UWP right now, and I'm using a custom renderer for Pickers. I'm actually overlaying the Picker on top of a label and icon so that when the user clicks the label/icon, it opens the picker. In order to accomplish this, I'm basically setting everything on the picker to transparent - the border, text, and background. The picker still functions just fine, and all picker elements are invisible, except the picker arrow is still visible. How do I affect the color of the picker arrow (in order to make it transparent), or just get rid of it altogether?

摆脱文本和背景颜色很容易:

Getting rid of the text and background color is as easy as:

var transparent = Windows.UI.Color.FromArgb(0, 0, 0, 0);
Control.Foreground = new SolidColorBrush(transparent);
Control.Background = new SolidColorBrush(transparent);

但是我不知道如何影响下拉箭头.

But I can't figure out how to affect the dropdown arrow.

我知道控件是FormsComboBox VisualElementRender<Picker, FormsComboBox>.Control，并且我尝试在Visual Studio中扫描控件的所有属性.

I know the Control is a FormsComboBox VisualElementRender<Picker, FormsComboBox>.Control, and I've tried scanning through all the properties of Control in Visual Studio.

推荐答案

对于自定义渲染， Picker 是 ComboBox .请参见渲染器基类和本机控件 .因此，对于您要更改的下拉箭头，它实际上是Combobox的控制模板内的DropDownGlyph元素.您可以复制默认的组合框样式和模板，然后通过将Visibility属性设置为Collapsed，将DropDownGlyph更新为不可见.例如:

For custom render, the correspondent native control of Picker is ComboBox in UWP . See Renderer Base Classes and Native Controls. So that for the drop down arrow you want to change , which is actually the DropDownGlyph element inside the control template of Combobox. You could copy the default ComboBox styles and templates and update the DropDownGlyph to not visible by setting the Visibility property to Collapsed. For example:

渲染器:

public class MyPickerRenderer : PickerRenderer
{
   protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
   {
       base.OnElementChanged(e);
       Control.Style=(Windows.UI.Xaml.Style)App.Current.Resources["pickerstyle"];
   }
}

App.xaml

<Application
    x:Class="PickerDemo.UWP.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:PickerDemo.UWP"
    RequestedTheme="Light">
    <Application.Resources>
        <Style x:Key="pickerstyle" TargetType="ComboBox">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ComboBox">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="32" />
                            </Grid.ColumnDefinitions>
                            <ContentPresenter
                                x:Name="HeaderContentPresenter"
                                Margin="{ThemeResource ComboBoxHeaderThemeMargin}"
                                x:DeferLoadStrategy="Lazy"
                                Content="{TemplateBinding Header}"
                                ContentTemplate="{TemplateBinding HeaderTemplate}"
                                FlowDirection="{TemplateBinding FlowDirection}"
                                FontWeight="{ThemeResource ComboBoxHeaderThemeFontWeight}"
                                Visibility="Collapsed" />
                            <Border
                                x:Name="Background"
                                Grid.Row="1"
                                Grid.ColumnSpan="2"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}" />
                            <Border
                                x:Name="HighlightBackground"
                                Grid.Row="1"
                                Grid.ColumnSpan="2"
                                Background="{ThemeResource SystemControlHighlightListAccentLowBrush}"
                                BorderBrush="{ThemeResource SystemControlHighlightBaseMediumLowBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Opacity="0" />
                            <ContentPresenter
                                x:Name="ContentPresenter"
                                Grid.Row="1"
                                Margin="{TemplateBinding Padding}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                <TextBlock
                                    x:Name="PlaceholderTextBlock"
                                    Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
                                    Text="{TemplateBinding PlaceholderText}" />
                            </ContentPresenter>
                            <FontIcon
                                x:Name="DropDownGlyph"
                                Grid.Row="1"
                                Grid.Column="1"
                                Margin="0,10,10,10"
                                HorizontalAlignment="Right"
                                VerticalAlignment="Center"
                                AutomationProperties.AccessibilityView="Raw"
                                FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                FontSize="12"
                                Foreground="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                                Glyph="&#xE0E5;"
                                IsHitTestVisible="False"
                                Visibility="Collapsed" />
                            <Popup x:Name="Popup">
                                <Border
                                    x:Name="PopupBorder"
                                    Margin="0,-1,0,-1"
                                    HorizontalAlignment="Stretch"
                                    Background="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}"
                                    BorderBrush="{ThemeResource SystemControlForegroundChromeHighBrush}"
                                    BorderThickness="{ThemeResource ComboBoxDropdownBorderThickness}">
                                    <ScrollViewer
                                        x:Name="ScrollViewer"
                                        MinWidth="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownContentMinWidth}"
                                        AutomationProperties.AccessibilityView="Raw"
                                        BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}"
                                        Foreground="{ThemeResource SystemControlForegroundBaseHighBrush}"
                                        HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                        HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                                        IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
                                        IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                                        IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                        VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                                        VerticalSnapPointsAlignment="Near"
                                        VerticalSnapPointsType="OptionalSingle"
                                        ZoomMode="Disabled">
                                        <ItemsPresenter Margin="{ThemeResource ComboBoxDropdownContentMargin}" />
                                    </ScrollViewer>
                                </Border>
                            </Popup>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="PointerOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlPageBackgroundAltMediumBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="BorderBrush">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightBaseMediumBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlBackgroundListMediumBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="BorderBrush">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightBaseMediumLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlBackgroundBaseLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="BorderBrush">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HighlightBackground" Storyboard.TargetProperty="BorderBrush">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightTransparentBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation
                                                Storyboard.TargetName="HighlightBackground"
                                                Storyboard.TargetProperty="Opacity"
                                                To="1"
                                                Duration="0" />
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="FocusedPressed">
                                        <Storyboard>
                                            <DoubleAnimation
                                                Storyboard.TargetName="HighlightBackground"
                                                Storyboard.TargetProperty="Opacity"
                                                To="1"
                                                Duration="0" />
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unfocused" />
                                    <VisualState x:Name="PointerFocused" />
                                    <VisualState x:Name="FocusedDropDown">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames
                                                Storyboard.TargetName="PopupBorder"
                                                Storyboard.TargetProperty="Visibility"
                                                Duration="0">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Visible</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="DropDownStates">
                                    <VisualState x:Name="Opened">
                                        <Storyboard>
                                            <SplitOpenThemeAnimation
                                                ClosedTargetName="ContentPresenter"
                                                OffsetFromCenter="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOffset}"
                                                OpenedLength="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOpenedHeight}"
                                                OpenedTargetName="PopupBorder" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Closed">
                                        <Storyboard>
                                            <SplitCloseThemeAnimation
                                                ClosedTargetName="ContentPresenter"
                                                OffsetFromCenter="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOffset}"
                                                OpenedLength="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOpenedHeight}"
                                                OpenedTargetName="PopupBorder" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Application.Resources>
</Application>

这篇关于Xamarin.Forms UWP-如何隐藏或更改Picker/ComboBox的颜色下拉箭头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！