Xamarin.Forms 콤보박스 컨트롤인 Picker 컨트롤에는 화살표시가 없습니다.

 

화살표시를 나타내기 위해서는 렌더러를 이용해야합니다.

우선 화살표 이미지를 먼저 구해야합니다. (전 아래 이미지로..)

  (downarrow)

사용할 이미지를 Android 프로젝트의 Resources/drawable 폴더에, iOS 프로젝트의 Resources 폴더에 추가합니다.

 

먼저 .Net Standard 프로젝트에

CustomPicker.cs 를 추가합니다.

using Xamarin.Forms;

namespace Test.Cntrol
{
    public class CustomPicker : Picker
    {
        public static readonly BindableProperty ImageProperty =
            BindableProperty.Create(nameof(Image), typeof(string), typeof(CustomPicker), string.Empty);

        public string Image
        {
            get { return (string)GetValue(ImageProperty); }
            set { SetValue(ImageProperty, value); }
        }

        public CustomPicker() : base()
        {
            Margin = 3;
        }
    }
}

 

Android 프로젝트에 CustomPickerRenderer.cs 를 추가합니다.

using Android.Content;
using Android.Graphics;
using Android.Graphics.Drawables;
using Android.Support.V4.Content;
using Test.Cntrol;
using Test.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(CustomPicker), typeof(CustomPickerRenderer))]
namespace Test.Droid
{
    public class CustomPickerRenderer : PickerRenderer
    {
        CustomPicker element;

        public CustomPickerRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
        {
            base.OnElementChanged(e);

            element = (CustomPicker)this.Element;

            if (Control != null && this.Element != null && !string.IsNullOrEmpty(element.Image))
                Control.Background = AddPickerStyles(element.Image);
        }

        public LayerDrawable AddPickerStyles(string imagePath)
        {
            ShapeDrawable border = new ShapeDrawable();
            border.Paint.Color = Android.Graphics.Color.Gray;
            border.SetPadding(10, 10, 10, 10);
            border.Paint.SetStyle(Paint.Style.Stroke);

            Drawable[] layers = { border, GetDrawable(imagePath) };
            LayerDrawable layerDrawable = new LayerDrawable(layers);
            layerDrawable.SetLayerInset(0, 0, 0, 0, 0);

            return layerDrawable;
        }

        private BitmapDrawable GetDrawable(string imagePath)
        {
            int resID = Resources.GetIdentifier(imagePath, "drawable", this.Context.PackageName);
            var drawable = ContextCompat.GetDrawable(this.Context, resID);
            var bitmap = ((BitmapDrawable)drawable).Bitmap;

            var result = new BitmapDrawable(Resources, Bitmap.CreateScaledBitmap(bitmap, 70, 70, true));
            result.Gravity = Android.Views.GravityFlags.Right;

            return result;
        }
    }
}

 

iOS 프로젝트에도 CustomPickerRenderer.cs 를 추가합니다.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

using Foundation;
using Test.Cntrol;
using Test.iOS;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(CustomPicker), typeof(CustomPickerRenderer))]
namespace Test.iOS
{
    public class CustomPickerRenderer : PickerRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
        {
            base.OnElementChanged(e);

            var element = (CustomPicker)this.Element;

            if (this.Control != null && this.Element != null && !string.IsNullOrEmpty(element.Image))
            {
                var downarrow = UIImage.FromBundle(element.Image);
                Control.RightViewMode = UITextFieldViewMode.Always;
                Control.RightView = new UIImageView(downarrow);
            }
        }
    }
}

 

이제 화면 상에서 아래 처럼 컨트롤을 정의한후 데이터를 바인딩하면

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:cntrol="clr-namespace:Test.Cntrol"
             x:Class="Test.MainPage">
    <StackLayout Spacing="5">
      
      <cntrol:CustomPicker x:Name="customPicker"
                           HeightRequest="40"
                           Margin="10"
                           Image="downarrow"
                           Title="Custom Picker"/>
    </StackLayout>
</ContentPage>

아래처럼 화살표시가 Picker 에 표시됩니다.

 

 

 

언제 부턴가 인터넷을 하다보면

위와 같은 에러가 떴다..; 이상한 사이트는 접속한적이 없는데..ㅜㅜ

윈도우 Defender, v3 Lite 로 검사해봤지만 아무것도 잡히지 않았다..

컴퓨터를 포맷을 하려다 mzk 라는 바이러스 검사 프로그램을 알게되어 확인해 보니

몇가지 에러를 잡아냈다. 설치 없이 실행파일을 실행하면 된다. (mzk.bat 파일을 관리자 권한으로 실행)

 

카페에서만 배포를 하고 주기적으로 DB 를 업데이트 하고 있는것 같은데

아무튼 이 프로그램만 바이러스를 인식하고 잡아냈다.

앞으로 또 지켜봐야겠지만.. 몇일 지났는데 동일 에러가 발생되지 않는다.

다운로드 링크

https://cafe.naver.com/malzero/94376

 

 

 

 

계속 폰으로 디버깅 하다가 원격으로 붙을 일이있어 에뮬레이터를 가동시켰는데

아래와 같이 떴다.. ??? 머지???

이전에 잘 사용했던 놈인데 갑자기 비번을 물어본다...;;

 

해결방법은 에뮬레이터 장치를 초기화해야한다. (원인은.. 모름모름..)

도구->Android->Android Device Manager 에서 장치목록에서 마우스 우클릭 후 나온 메뉴에서 '초기화' 를 하면된다.

 

아래처럼 에뮬레이터가 잘 실행되었다.

 

+ Recent posts

티스토리 툴바