Change 'RemoveButton' 'X' icon in TKAutoCompleteTokenView

[Andy]

Hi,

 

I was trying to replace the 'X' image in 'CloseButton' for the Token, but I cannot remove the original image

This is my code inside of TKAutoCompleteDelegate class:

 

public class TKAutoCompleteDelegateWrap : TKAutoCompleteDelegate
    {
        //public List<UserAndGroupResult> UserToSendList { get; set; }

        public override void DidAddToken(TKAutoCompleteTextView autocomplete, TKAutoCompleteToken token)
        {
            var t = ((TKSuggestionListView)autocomplete.WeakSuggestionView).SelectedIndexPath;
            var tt = t.Row;

            var tt1 = (TKAutoCompleteTokenWrap)token;
            Console.Write(tt1.Id);
            ((TKListView)autocomplete.WeakSuggestionView).ScrollToItem(((TKSuggestionListView)autocomplete.WeakSuggestionView).SelectedIndexPath, UICollectionViewScrollPosition.Top, true);
        }
        public override void DidSelectToken(TKAutoCompleteTextView autocomplete, TKAutoCompleteToken token)
        {
            Console.WriteLine();
        }

        public override void DidAutoComplete(TKAutoCompleteTextView autocomplete, TKAutoCompleteToken token)
        {
            
        }
        public override void DidRemoveToken(TKAutoCompleteTextView autocomplete, TKAutoCompleteToken token)
        {
            
        }

        public override TKAutoCompleteTokenView ViewForToken(TKAutoCompleteTextView autocomplete, TKAutoCompleteToken token)
        {
            TKAutoCompleteTokenView tokenView = new TKAutoCompleteTokenView(token);

            tokenView.BackgroundColor = GlobalUI.LABEL_TEXT_COLOR_DARK;
            tokenView.TextLabel.Font = UIFont.FromName(GlobalUI.FONT_NEXT, 15);
            tokenView.TextLabel.TextColor = StyleKit.White;

            tokenView.Layer.CornerRadius = 5;
            tokenView.ImageView.Layer.CornerRadius = 3;

            TKAutoCompleteTokenRemoveButton _closeBtn = (TKAutoCompleteTokenRemoveButton)tokenView.RemoveButton; 
            _closeBtn.SetImage(StyleKit.ImageOfX_Ico_White(new CGSize(10,10)), UIControlState.Normal);
         
            return tokenView;
        }

    }

 

So, The attached file is showing that I am getting two images over one other.

 

how can I do to fix that?

 

Thanks.

 

 

 

[Nikolay]

Hello Andy,

Thank you for contacting us.

The default "X" icon in the tokens is not removed after setting your own image, because the "X" symbol is actually drawn inside the button. The easiest way to remove it is to set TintColor property of the TokenView button to transparent color. Here is a simple code snipped of how you can achieve this:

TKAutoCompleteTokenRemoveButton _closeBtn = (TKAutoCompleteTokenRemoveButton)tokenView.RemoveButton;
_closeBtn.TintColor = UIColor.FromRGBA(0, 0, 0, 0);

I hope I've been helpful.

Regards,
Nikolay
Progress Telerik

[Andy]

It works! Thank you!