Nathan Bottom Sheet (Xamarin Forms)

---

Custom Bottom sheet that can be swept down and swept up

Options

---

Interface (INathanPicker)

Methods

• void VisiblePicker();
  NathanPicker를 띄웁니다.

• void InVisiblePicker();
  NathanPicker를 숨깁니다.

• void AddItem(string text);

• void AddItem(string text, string imageSource); (overload)

• void AddItem(PickerItem pickerItem); (overload)
  NathanPicker 목록을 추가합니다.

• void DeleteItem(int index);
  index'에 위치한 목록을 삭제합니다.

• string GetItemText(int index);
  'index'에 위치한 목록의 이름을 가져옵니다.

Properties

• DFDesignRectangleFromBottom375 PickerRectangle { get; set; }
  NathanPicker의 높이를 조절하기 위해 사용합니다.

• bool HasIcon { get; set; }
  NathanPicker 목록 아이콘 활성 상태를 가져오거나 설정합니다.

• IList ItemsSource { get; set; }
  표시할 항목의 목록을 가져오거나 설정합니다.

• string Title { get; set; }
  NathanPicker 제목을 가져오거나 설정합니다. 기본 값은 ""입니다.

• Color TitleColor { get; set; }
  NathanPicker 제목 생상을 가져오거나 설정합니다. 기본 값은 Color.Default 입니다.

• double TitleFontSize { get; set; }
  NathanPicker 제목 폰트 크기를 가져오거나 설정합니다.

• string TitleImageSource { get; set; }
  NathanPicker 제목 아이콘을 가져오거나 설정합니다. 기본 값은 "" 입니다.

• Color TextColor { get; set; }
  NathanPicker 목록 색상을 가져오거나 설정합니다. 기본 값은 Color.Default 입니다.

• FontAttributes FontAttributes { get; set; }
  NathanPicker 목록 FontAttributes를 가져오거나 설정합니다. 기본 값은 FontAttributes.None 입니다.

• double CharacterSpacing { get; set; }
  NathanPicker 목록 자간을 가져오거나 설정합니다. 기본 값은 0 입니다.

• double FontSize { get; set; }
  NathanPicker 목록 폰트 크기를 가져오거나 설정합니다.

• string FontFamily { get; set; }
  NathanPicker 목록 글꼴을 가져오거나 설정합니다. 기본 값은 null 입니다.

• bool SearchEnabled { get; set; }
  검색 기능 활성 상태를 가져오거나 설정합니다. 기본 값은 true 입니다.

• int SelectedIndex { get; set; }
  NathanPicker에서 선택한 항목의 인덱스를 가져오거나 설정합니다.

Sample

---

_picker = new NathanPicker
            {
                PickerRectangle = DFDesignMainPage.bottomPanContainer08Rectangle,
                HasIcon=false,
                ItemsSource = new List<PickerItem>
                {
                    new PickerItem("Protect myself from Coronavirus Disease"),
                    new PickerItem("Destress/deload","iconListCategoryGeneral"),
                    new PickerItem("Live healthy without a diet"),
                    new PickerItem("Lose weight"),
                },
                TextColor = Color.Default,
                Title = "Related Dream",
                TitleColor = Color.Default,
                TitleFontSize = DFDesignMainPage.PickerTitleFontSize.Value,
                TitleImageSource = "iconListCategoryPCopy",
                SearchEnabled = true,
                FontSize = DFDesignMainPage.PickerTitleFontSize.Value,
                FontFamily = null,
                FontAttributes = FontAttributes.None,
                CharacterSpacing = -0.3,
                SortType=SortType.None
            };


_picker.SelectedIndexChanged += (sender, e) =>
{
     _button.ButtonLabel.Text = _picker.GetItemText(_picker.SelectedIndex);
};

...

button.Clicked+=(s,e)=>{ _picker.VisiblePicker(); };

ScreenShot

---

HasIcon == true

HasIcon == false

Sweep Down

Background Touch

Scroll

Search

Item Select

BottomSheet Default

NathanBottomSheet을 상속하여 활용할 수 있습니다.