iSeller Commerce
iSeller POS Retail
iSeller POS F&B
iSeller POS Express
Crosslight
WebUI
ClientUI
What's New
Download Trial
Web Solution
Mobile Solution
Enterprise Solution
Custom Development
Blog
Community
Latest Development Blogs
ForumPostTopic
Browse By Tag
Hello Crosslight Support,
I have some questions about the "Editable Table View" on iOS.
1. How can I customize button names? In the editable table view there is an "Edit" button on the top right corner. Entering edit mode the button name turns to "Done". How can I translate these names, because my language is German and the names should be "Bearbeiten" and "Fertig".
2. When entering the edit mode, a toolbar appears at the bottom. Here one can have a "Delete" button for example like in your "Data Sample -> Multiple Delete". How is it possible to add custom buttons and bind these buttons to commands in the ViewModel.
Thanks for your support.
Thomas
Hello Leo,
works as intended.
Thanks,
Hi Thomas,
For your first question, you could bind EditButton to viewmodel and set it to the value you want to display. Then set the value acording to current state. The following are the sample code:
BindingProvider:
this.AddBinding("EditButton", BindableProperties.TextProperty, "EditText",BindingMode.TwoWay); this.AddBinding("TableView", BindableProperties.IsEditingProperty, "IsEditing", BindingMode.TwoWay);
ViewModel:
public string EditText { get { return (!base.IsEditing) ? "Bearbeiten" : "Fertig"; } } protected override void OnPropertyChanged(string propertyName) { base.OnPropertyChanged(propertyName); if(propertyName == "IsEditing"){ OnPropertyChanged("EditText"); } }
Regarding the second question, you need to create the button and add it to view when InitializeView was called. Then Bind your button to a command in bindingprovider. The following are the sample code on how to do it:
ViewController:
UIBarButtonItem customButton = new UIBarButtonItem(); customButton.Style = UIBarButtonItemStyle.Bordered; customButton.Title = "Button"; this.SetToolbarItems(new UIBarButtonItem[] { deleteButton, customButton }, false); this.RegisterViewIdentifier("CustomButton", customButton);
Binding Provider:this.AddBinding("CustomButton", BindableProperties.CommandProperty, "CustomCommand");
That should do it.
Best Regards,Leo
Thank you for your support.
The custom bar button works as you described :)
The custom text for the "Edit" button does not always work as described :(
In the ViewController I had to add 'this.RegisterViewIdentifier("EditButton", this.EditButton);' even when using the built-in edit button. Without this line the data binding has no connection to the button. The "TwoWay" binding mode for the text is not necessary, because the update is always triggered by the ViewModel and there is no setter in the "EditText" property, too. Nevertheless thank you for your hints.
In the mean time I have another problem. I added a custom button to the toolbar when in edit mode. It is a "Select all" button. The button is bound to a DelegateCommand. When I am in edit mode and there are items in the table the button is active. When I click the button I hit the related method of the DelegateCommand and I add each item of the table to "this.SelectedItems". The "OnSelectedItemsCollectionChanged" gets called when I modify the "this.SelectedItems". The problem is that the selected state of a table item is not displayed in the table. When in edit mode each table item has a circle on the left side. When selecting an item the circle turns blue and is checked. But when I add the items to 'this.SelectedItems' programmatically, the circles remain empty and the are not blue and checked.
I added two screenshots to clarify the problem.
A quick solution would be nice.
Yes. You must add this.RegisterViewIdentifier("EditButton", this.EditButton);Sorry, I seem I miss it on my answer.
Regarding setting SelectedItems programmatically, there is a work around by implementing this in view controller:
protected override void OnViewModelPropertyChanged(PropertyChangedEventArgs e){ if(e.PropertyName == "SelectedItems"){ //Deselected all item in view if(this.TableView.IndexPathsForSelectedRows != null) foreach(NSIndexPath selectedPath in this.TableView.IndexPathsForSelectedRows){ this.TableView.DeselectRow(selectedPath, true); } //Reselect all item based on current SelectedItems on ViewModel if(this.ViewModel.SelectedItems != null) foreach(DataSamples.Models.Item item in this.ViewModel.SelectedItems){ var index = this.ViewModel.Items.IndexOf(item); var groupIndex = 0; if(this.ViewModel.GroupItems != null){ bool founded = false; List<CategoryGroup> list = (List<CategoryGroup>)this.ViewModel.GroupItems; for(int i=0;i<list.Count;i++){ var groupItem = list[i]; for(int j=0;j<groupItem.Count;j++){ var tempItem = groupItem[j]; if(tempItem == item){ index = j; groupIndex = i; break; } } if (founded) break; } } var indexs = NSIndexPath.FromRowSection(index, groupIndex); this.TableView.SelectRow(indexs,true,UITableViewScrollPosition.None); } } }
For your information, Programmatically change SelectedItems property in ViewModel in editing mode issue has been fixed. You should be able to find the hotfix from this link.
note : It is recommended to removed the work around that have been suggested previously before you applied this hotfix.
Edit : Hotfix Link has been fixed.
or
Choose this if you're already a member of Intersoft Community Forum. You can link your OpenID account to your existing Intersoft Social ID.
Choose this if you don't have an Intersoft account yet. Your authenticated OpenID will be automatically linked to your new Intersoft account.
Enter your Wordpress Blogname