如何在Android(Xamarin Forms)上更改按钮的文本对齐方式?

问题描述 投票:0回答:2
  • 我用Xamarin Forms,
  • 在iOS上:文本对齐按钮显示很好

align_text_iOS

  • 但在Android上:按钮的文本对齐始终显示“中心”

align_text_Android

我在Android上找不到属性更改文本对齐按钮。

在Android上,我希望文本对齐按钮是Android的“开始”或更改按钮,与iOS的按钮相同。

这是我的代码:

 <Button 
    HeightRequest="15"
    Text="{Binding Phone2}"
    BackgroundColor="Aqua"
    TextColor="{x:Static color:BasePalette.DarkestColor}"
    HorizontalOptions="Start"
    VerticalOptions="Center" />

请支持我!

谢谢!

xamarin xamarin.forms xamarin.android xamarin.ios
2个回答
2
投票

您正在寻找的是像这个XLab Control

 public class ExtendedButton : Button
{
    /// <summary>
    /// Bindable property for button content vertical alignment.
    /// </summary>
    public static readonly BindableProperty VerticalContentAlignmentProperty =
        BindableProperty.Create<ExtendedButton, TextAlignment>(
            p => p.VerticalContentAlignment, TextAlignment.Center);

    /// <summary>
    /// Bindable property for button content horizontal alignment.
    /// </summary>
    public static readonly BindableProperty HorizontalContentAlignmentProperty =
        BindableProperty.Create<ExtendedButton, TextAlignment>(
            p => p.HorizontalContentAlignment, TextAlignment.Center);

    /// <summary>
    /// Gets or sets the content vertical alignment.
    /// </summary>
    public TextAlignment VerticalContentAlignment
    {
        get { return this.GetValue<TextAlignment>(VerticalContentAlignmentProperty); }
        set { this.SetValue(VerticalContentAlignmentProperty, value); }
    }

    /// <summary>
    /// Gets or sets the content horizontal alignment.
    /// </summary>
    public TextAlignment HorizontalContentAlignment
    {
        get { return this.GetValue<TextAlignment>(HorizontalContentAlignmentProperty); }
        set { this.SetValue(HorizontalContentAlignmentProperty, value); }
    }
}

Android渲染器:

public class ExtendedButtonRenderer : ButtonRenderer
{
    /// <summary>
    /// Called when [element changed].
    /// </summary>
    /// <param name="e">The e.</param>
    protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
    {
        base.OnElementChanged(e);
        UpdateAlignment();
        UpdateFont();
    }

    /// <summary>
    /// Handles the <see cref="E:ElementPropertyChanged" /> event.
    /// </summary>
    /// <param name="sender">The sender.</param>
    /// <param name="e">The <see cref="PropertyChangedEventArgs"/> instance containing the event data.</param>
    protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        if (e.PropertyName == ExtendedButton.VerticalContentAlignmentProperty.PropertyName ||
            e.PropertyName == ExtendedButton.HorizontalContentAlignmentProperty.PropertyName)
        {
            UpdateAlignment();
        }
        else if (e.PropertyName == Button.FontProperty.PropertyName)
        {
            UpdateFont();
        }

        base.OnElementPropertyChanged(sender, e);
    }

    /// <summary>
    /// Updates the font
    /// </summary>
    private void UpdateFont()
    {
        Control.Typeface = Element.Font.ToExtendedTypeface(Context);
    }

    /// <summary>
    /// Sets the alignment.
    /// </summary>
    private void UpdateAlignment()
    {
        var element = this.Element as ExtendedButton;

        if (element == null || this.Control == null)
        {
            return;
        }

        this.Control.Gravity = element.VerticalContentAlignment.ToDroidVerticalGravity() |
            element.HorizontalContentAlignment.ToDroidHorizontalGravity();
    }
}

iOS渲染器:

 public class ExtendedButtonRenderer : ButtonRenderer
{
    /// <summary>
    /// Called when [element changed].
    /// </summary>
    /// <param name="e">The e.</param>
    protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
    {
        base.OnElementChanged(e);

        var element = this.Element;

        if (element == null || this.Control == null)
        {
            return;
        }

        this.Control.VerticalAlignment = this.Element.VerticalContentAlignment.ToContentVerticalAlignment();
        this.Control.HorizontalAlignment = this.Element.HorizontalContentAlignment.ToContentHorizontalAlignment();
    }

    /// <summary>
    /// Handles the <see cref="E:ElementPropertyChanged" /> event.
    /// </summary>
    /// <param name="sender">The sender.</param>
    /// <param name="e">The <see cref="PropertyChangedEventArgs"/> instance containing the event data.</param>
    protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        switch (e.PropertyName)
        {
            case "VerticalContentAlignment":
                this.Control.VerticalAlignment = this.Element.VerticalContentAlignment.ToContentVerticalAlignment();
                break;
            case "HorizontalContentAlignment":
                this.Control.HorizontalAlignment = this.Element.HorizontalContentAlignment.ToContentHorizontalAlignment();
                break;
            default:
                base.OnElementPropertyChanged(sender, e);
                break;
        }
    }

    /// <summary>
    /// Gets the element.
    /// </summary>
    /// <value>The element.</value>
    public new ExtendedButton Element
    {
        get
        {
            return base.Element as ExtendedButton;
        }
    }
}

不要忘记在两个渲染器ExportRenderer上添加[assembly: ExportRenderer(typeof(ExtendedButton), typeof(ExtendedButtonRenderer))]属性

Goodluck可以在查询时自由恢复


0
投票

您需要为按钮创建自定义渲染器,然后在控件的自定义中调用:

button.Gravity = GravityFlags.Left;

您将看到您的文本与左侧对齐。


推荐问答