I try to select a row to edit and I'm not sure which layout I should be using ( list , grid, Table , etc...) ( currently trying to use a grid layout with boxview but can't seem to get GestureRecognizers or Tapped to work) the functions the App needs ( listed in case it makes a difference ) - but I only need help with #2 open, read , display and group a Json file's data (done) select row to edit ( I'm stuck) send all data in row to edit page ( or edit the selected row in place) (not started) write data to output file. (not started) in case it matters, I'm using Page Pagemodel and Model style. Page - xmal and code behind which only contains (using, namespace and the following code) public partial class CheckListPage : ContentPage { public CheckListPage() { InitializeComponent(); } } ```**Pagemodel** - contains the bulk of the code **Models**- contains the records get set (ex . public string Comments { get; set; }) TIA Tim

Leon, forget about this post. I think the problem I'm having is the xaml Grid code. ( I can't get it to trigger a tapped event) I'm going to rewrite the xaml and remove the Grid and write it as a listview only. all my other listview pages change the background color when I tap the line. so I think I can get an event to fire. Thanks for trying to Help me with this code. Tim

Xamarin forms -- which layout is best for selecting a row for editing the items in it ( grid, list or table - or other?)

tim 120

I try to select a row to edit and I'm not sure which layout I should be using ( list , grid, Table , etc...)

( currently trying to use a grid layout with boxview but can't seem to get GestureRecognizers or Tapped to work)

the functions the App needs ( listed in case it makes a difference ) - but I only need help with #2

open, read , display and group a Json file's data (done)
select row to edit ( I'm stuck)
send all data in row to edit page ( or edit the selected row in place) (not started)
write data to output file. (not started)

in case it matters, I'm using Page Pagemodel and Model style.

Page - xmal and code behind which only contains (using, namespace and the following code)

public partial class CheckListPage : ContentPage

{

    public CheckListPage()

    {

        InitializeComponent();

    }      

}
```**Pagemodel**   - contains the bulk of the code

**Models**- contains the records get set  (ex .  public string Comments { get; set; })

TIA 

Tim

Bruce (SqlWork.com) 56,531 Reputation points

2024-03-30T23:05:31.57+00:00

As Xamarin forms is only supported until May 1 (tad over a month), it seems like you should be moving to a new technology.
Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2024-04-01T06:04:27.48+00:00

Do you want to implement click item in the list, then open the navigated page for item details. edit the details, you will navigate back to the list page and show the updated item?

Or do you want to edit the item in the list page?
tim 120 Reputation points

2024-04-02T13:31:42.9866667+00:00
Leon,

either of the option would work for me.
but seeing that I most of the code written of first option,

I think we go with it,

Not sure how to pass the data to the page, I've tried passing the workchecklist class as an object ( which VS2019 states it not one).

public class WorkCheckListItem { public int Sector { get; set; } public string Comments { get; set; } public double GridX { get; set; } }

Also, the following does not work, the Tapped command does not seem to trigger. I'm sure I'm missing something in the checklist page.

would prefer to use the selecteditem option to trigger the editing. but will use what is the best way to select the row.

... OnEditDataAction();

( does Grid in the xaml prevent the selectedItem from firing? I have a listview (non grid) that seem to select the row ( changes the background color) but not on this page).

<Label Grid.Row="0" Grid.Column="15" HorizontalOptions="Center" VerticalOptions="Center" Text="{Binding Tapped}" ></Label> <Image x:Name="EditData" Grid.Row="0" Grid.Column="16" Source="edit.png" HorizontalOptions="CenterAndExpand" > <Image.GestureRecognizers> <TapGestureRecognizer Tapped= "EditDataTapped" NumberOfTapsRequired="1" /> </Image.GestureRecognizers </Image>

Checklist page

public void EditDataTapped(object sender, System.EventArgs e) { }

I'm not sure if I can do the following.

I have a page for entering new data. which has the same fields as the checklist page, the only difference is the checklist page reads a file and displays the data in the grid listview. the Info page has a binding section for entering new data and will save the record to a file then display the data in the ListView.

I've not seen any tutorials on how to pass data from the checklist to the info page and populate the Binding data fields.

public class InfoPageModel : PageModelBase { public static string SaveStatus = ""; private string _sector; public string Sector { get => _sector; set { SetProperty(ref _sector, value); } }

Thanks,

Tim

Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Microsoft Vendor

If you <Image x:Name="EditData"> in the Listview. You can add Command and CommandParameter to the TapGestureRecognizer

  <ListView   x:Name="myListView"

                    ItemsSource="{Binding WorkCheckListItems}"

                   HasUnevenRows="True"

                   >

           <ListView.ItemTemplate>

               <DataTemplate>

                   <ViewCell>

                       <StackLayout>

                           <Label Grid.Row="0" HorizontalOptions="Center" VerticalOptions="Center" Text="{Binding Comments}" ></Label>

                           <Image x:Name="EditData" WidthRequest="100" HeightRequest="100" Grid.Row="0" Grid.Column="1" Source="edit.png" HorizontalOptions="CenterAndExpand" >

                               <Image.GestureRecognizers>

                                   <TapGestureRecognizer

                                        Command="{Binding BindingContext.EditCommand, Source={x:Reference myListView}}"

                                        CommandParameter="{Binding .}"

                                    />

                               </Image.GestureRecognizers>

                           </Image>

                       </StackLayout>

                   </ViewCell>

               </DataTemplate>

           </ListView.ItemTemplate>

       </ListView>

In your VIewModel, you can implement this EditCommand and get click the item.

public class MyViewModel
{
    public ICommand EditCommand { get; set; }
    public List<WorkCheckListItem> WorkCheckListItems { get; set; }    
    public MyViewModel()
    {
//I donot have Json data, I add the data to the List for testing.
        WorkCheckListItems = new List<WorkCheckListItem>();
        for (int i = 0; i < 10; i++)
        {
            WorkCheckListItems.Add(new WorkCheckListItem() { Comments="TEST"+i, Sector=i});    
        }
        EditCommand = new Command((obj) =>
        {
            var  selectedItem= obj as WorkCheckListItem;
            //navigate to the detailed page to edit it. 
       });
    }
}

By the way, do not forget to add bindingContext in the layout background code.

public NewPage3()
{
    InitializeComponent();


   BindingContext = new MyViewModel();
}

tim 120 Reputation points

2024-04-04T00:29:52.8933333+00:00

Leon , Thanks!

I'll work on adding the code to my app.

Again Thanks for helping me with this.

Tim.
Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2024-04-04T00:39:04.02+00:00

You are welcome, if you still have questions about this thread, you can update here. If you have other questions, you can open new threads.

As note:Guidelines for posting a quality question on Microsoft Q&A
tim 120 Reputation points

2024-04-05T16:13:21.7166667+00:00
Leon, I'm not able to get the code you posted to work, I tried to post my code with and without screenshots of the app but it was deleted, (twice) not sure why.

issues

I can't get the edit command to fire.

I can get the edit.png to appear on the line, ( do not really need this , using selecteditem would work for me.)

not sure how to pass the WorkCheckListItem to the treeinfopage and populate the fields.

The treeinfopage is used to allow me to enter a single line of data and save the data to a file and display the data in a list view.

I thought I could also use treeinfopage to validate and edit the data later if needed. ( by selecting one for the checklistpage record.)

ChecklistPage.xaml

`<ListView x:Name="ChecklistView" ItemsSource="{Binding MyItems}" IsGroupingEnabled="True" GroupShortNameBinding="{Binding Key}" GroupDisplayBinding="{Binding Key}"> `

<ListView.ItemTemplate >

<DataTemplate>

<ViewCell>

checklistPage.xaml.cs

using MapleSugar.PageModels;

using Xamarin.Forms;

using Xamarin.Forms.Xaml;

namespace MapleSugar.Pages

{

[XamlCompilation(XamlCompilationOptions.Compile)]

public partial class CheckListPage : ContentPage

{

public CheckListPage()

{

InitializeComponent();

BindingContext = new CheckListPageModel();

}

}

}

ChecklistPageModel.cs editDataTapped not called but assume it should be part of editDataAction .

public void EditDataTapped(object sender, System.EventArgs e)

{

WorkTreeLocationItems.Insert(0, new WorkTreeLocationItem

{ WorkSector = Convert.ToInt32(_sector),

WorkTreeNumber = Convert.ToInt32(_treeNumber),

WorkSubTreeNumber = Convert.ToInt32(_subTreeNumber),

WorkTreeSubLetter = _treeSubLetter,

WorkTreeLocation = _treeLocation,

WorkCircumference = Convert.ToDouble(_circumference),

WorkTreeCombineWith = Convert.ToDouble(_treeCombineWith),

WorkComments = _comments,

WorkGridX = Convert.ToDouble(_gridX),

WorkGridY = Convert.ToDouble(_gridY),

WorkLatSec = Convert.ToDouble(_latSec),

WorkLonSec = Convert.ToDouble(_lonSec),

WorkContainer = _container

});

}

public void EditDataAction()

{

WorkCheckListItems = new List<WorkCheckListItem>();

for (int i = 0; i < 10; i++)

{

WorkCheckListItems.Add(new WorkCheckListItem() { Comments = "TEST" + i, Sector = i });

}

EditCommand = new Command((obj) =>

{

var selectedItem = obj as WorkCheckListItem;

//navigate to the detailed page to edit it.

});

}
tim 120 Reputation points

2024-04-05T16:14:53.94+00:00

Leon, I'm not able to get the code you posted to work, I tried to post my code with and without screenshots of the app but it was deleted, (twice so far) not sure why.

( in case my third attempt is deleted)

tim 120

Leon, here is ICommand code that I did not put in the last post, and other parts of CheckListPageModel that might be of use.

namespace MapleSugar.PageModels

{

public class CheckListPageModel : PageModelBase    {

    public ICommand EditCommand { get; set; }

    public List<WorkCheckListItem> WorkCheckListItems { get; set; }

    private int _sector;

    public int Sector

    ObservableCollection<WorkTreeLocationItem> _workTreeLocationItem;

    public ObservableCollection<WorkTreeLocationItem> WorkTreeLocationItems

    {

        get => _workTreeLocationItem;

        set => SetProperty(ref _workTreeLocationItem, value);

    }
``` public CheckListPageModel()

```typescript
    {

        WorkTreeLocationItems = new ObservableCollection<WorkTreeLocationItem>();

      //  EditCommand = new ButtonModel("Edit", EditDataAction);

        Load_Button_Clicked = new ButtonModel("Load Data", LoadCheckListAction);

        Close_App_Clicked = new ButtonModel("Close App", CloseAppAction);
```Tim

3 answers

Deleted

This answer has been deleted due to a violation of our Code of Conduct. The answer was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.

Comments have been turned off. Learn more
Deleted

This answer has been deleted due to a violation of our Code of Conduct. The answer was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.

Comments have been turned off. Learn more
tim 120 Reputation points

2024-04-07T00:51:50.14+00:00

Leon, forget about this post.

I think the problem I'm having is the xaml Grid code. ( I can't get it to trigger a tapped event)

I'm going to rewrite the xaml and remove the Grid and write it as a listview only. all my other listview pages change the background color when I tap the line. so I think I can get an event to fire.

Thanks for trying to Help me with this code.

Tim
Please sign in to rate this answer.
Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,656 Reputation points Microsoft Vendor

2024-04-09T05:54:57.2333333+00:00

OK, thanks for your update.
Sign in to comment