2017-11-25 33 views
1

저는 Xamarin Forms에서 응용 프로그램을 개발 중이며 오랜 시간 전에 수정해야하는 버그에 직면했습니다. 프레임에 윤곽선을 설정하려했지만 이모티콘에서는 잘 작동하지만 안드로이드에서는 작동하지 않습니다.Frame OutlineColor가 Android, Xamarin Forms에서만 작동하지 않습니다.

여기 내 프레임은 xaml입니다.

<Frame 
    HasShadow="true" 
    CornerRadius="10" 
    OutlineColor="Red" 
    BackgroundColor="White"> 
    <StackLayout 
     Orientation="Horizontal"> 
     <Label 
     Text="TEST" 
     VerticalOptions="Center"/> 
     <Label 
     Text="For OUTLINE" 
     VerticalOptions="Center"/> 
    </StackLayout> 
</Frame> 

어떤 도움을 주셔서 감사합니다!

답변

2

안드로이드에서는 작동하지 않습니다. 버그는 here으로보고됩니다.

해결 방법 1 : 다음과 같이

당신은 안드로이드 플랫폼에 대한 Frame에 대한 Renderer을해야는 :

using System; 
using Android.Graphics.Drawables; 
using Xamarin.Forms; 
using Xamarin.Forms.Platform.Android; 
using XFormsUI.Droid; 

[assembly: ExportRenderer(typeof(Frame), typeof(RoundBorderFrameRenderer))] 
namespace XFormsUI.Droid 
{ 
    public class RoundBorderFrameRenderer : FrameRenderer 
    { 
     protected override void OnElementChanged(ElementChangedEventArgs<Frame> e) 
     { 
      base.OnElementChanged(e); 

      if (e.NewElement != null && e.OldElement == null) 
      { 
       SetBackgroundResource(Resource.Drawable.round_border_frame); 

       //Write following lines if you want to bring the XAML Frame Elements's background Color into Native. Otherwise, Frame's BackgroundColor will not be effective. 
       GradientDrawable drawable = (GradientDrawable)Background; 
       string FrameBackgroundColorHex = String.Format("#{0:X2}{1:X2}{2:X2}", (int)(e.NewElement.BackgroundColor.R * 255), (int)(e.NewElement.BackgroundColor.G * 255), (int)(e.NewElement.BackgroundColor.B * 255)); 
       drawable.SetColor(Android.Graphics.Color.ParseColor(FrameBackgroundColorHex)); 
      } 
     } 
    } 
} 

이 또한 xml(round_border_frame.xml) 선택 파일이 필요합니다. 이 파일을 Drawable 폴더에 저장하십시오.

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> 
    <!--We need to give Frame's 'BorderColor Here--> 
    <stroke android:width="1dp" android:color="#FF0000" /> 
    <corners android:radius="10dp" /> 
</shape> 

해결 방법 2 :

선택 xml 파일없이 Renderer 사용. Source.

using System; 
using Android.Graphics; 
using Xamarin.Forms; 
using Xamarin.Forms.Platform.Android; 
using XFormsUI.Droid; 

[assembly: ExportRenderer(typeof(Frame), typeof(RoundBorderFrameRenderer))] 
namespace XFormsUI.Droid 
{ 
    public class RoundBorderFrameRenderer : FrameRenderer 
    { 
     public override void Draw(Canvas canvas) 
     { 
      base.Draw(canvas); 

      using (var paint = new Paint { AntiAlias = true }) 
      using (var path = new Path()) 
      using (Path.Direction direction = Path.Direction.Cw) 
      using (Paint.Style style = Paint.Style.Stroke) 
      using (var rect = new RectF(0, 0, canvas.Width, canvas.Height)) 
      { 
       float px = Forms.Context.ToPixels(Element != null ? Element.CornerRadius : 10); //Default Corner Radius = 10 
       float py = Forms.Context.ToPixels(Element != null ? Element.CornerRadius : 10); //Default Corner Radius = 10 
       path.AddRoundRect(rect, px, py, direction); 

       //Set the Width of the Border here 
       paint.StrokeWidth = 1f; 
       paint.SetStyle(style); 

       //Take OutLineColor from XAML Frame element and set it natively here. 
       string FrameBorderColorHex = String.Format("#{0:X2}{1:X2}{2:X2}", (int)(Element.OutlineColor.R * 255), (int)(Element.OutlineColor.G * 255), (int)(Element.OutlineColor.B * 255)); 
       paint.Color = Android.Graphics.Color.ParseColor(FrameBorderColorHex); 
       canvas.DrawPath(path, paint); 
      } 
     } 
    } 
} 

해결 방법 3 :

그러나이 최선의 해결책 아니지만 해결의 종류의 : 은 외부 FrameFrame 다른 내부 가진 Padding 랩과는 BackgroundColor 무엇에 테두리 색상이어야 설정합니다.

참고 : 아직 iOS에서는 확인하지 않았습니다.

<Frame BackgroundColor="Red" CornerRadius="10" Padding="1,1,1,1"> 
    <Frame CornerRadius="10" BackgroundColor="White"> 
     <StackLayout Orientation="Horizontal"> 
      <Label Text="TEST" VerticalOptions="Center" /> 
      <Label Text="For OUTLINE" VerticalOptions="Center" /> 
     </StackLayout> 
    </Frame> 
</Frame> 

사람들은이 내용을이 thread에서 논의하고 있습니다.

희망이 도움이 될 것입니다!