Xamarin Forms: Flowlistview item tapping issue

SreeeeSreeee INMember ✭✭✭✭✭
edited December 3 in Xamarin.Forms

I am implementing a game in my xamarin forms application, a name match game. It has two lists: one for showing the images and the other one for showing the names. The player taps the image from the top list and then taps the name from the bottom list(or name first then image). If they match the player gets points and tapped image and name will be removed from lists.

I am using flowlistview for showing the image list and name list because I need to show multiple items in a row. When tapping the image and name I have done the matching and remove the image and name if they matched. But I need to highlight the selected image or selected name when tapping and disable selection for other items. I have done highlighting feature using this thread, but it is not working perfectly. Sometimes multiple images are highlighting and sometimes when selecting an image on the top name on the below list is automatically highlighting.

I have created a sample project and uploaded it here. Please help me to complete this game. We have this game on our website, https://www.catholicbrain.com/edu-namematch/39524/1/the-two-great-commandments , please have a look at it for the working of the game. I will give you login details by DM.

Best Answer

Answers

  • LeonLuLeonLu Member, Xamarin Team Xamurai

    If you want to hide the item in the Flowlistview, you can use IsVisible="{Binding MyVisiabel Mode=TwoWay}" attribute.
    For example, Here is a button.

     <Button x:Name="start_btn" Clicked="startPanic" IsVisible="{Binding IsStartVisible}">
      <Button.Text>START</Button.Text>
    </Button>
    
     <Button x:Name="stop_btn" IsVisible="{Binding IsStopVisible}">
        <Button.Text>STOP</Button.Text>
      </Button>
    

    And add the property. You can change the value based on your logic.

       private bool _isStopVisible;
    
    public bool IsStopVisible{
        get {
            return _isStopVisible;
        }
        set {
            _isStopVisible= value;
            RaisePropertyChanged ("IsStopVisible");
        }
    }
    
  • SreeeeSreeee INMember ✭✭✭✭✭

    @LeonLu Hiding of items is working, my problem is sometimes multiple images are highlighting and sometimes when selecting an image on the top, name on the below list is automatically highlighting. Did you get a chance to check my sample project?

  • SreeeeSreeee INMember ✭✭✭✭✭

    @ColeX Can you help me?

  • SreeeeSreeee INMember ✭✭✭✭✭

    @ColeX and @LeonLu It has 2 different flowlistviews. On the top an image list and on the bottom a name list. This is a simple game for kids, the player taps the image from the top list and then taps the name from the bottom list(or name first then image). If they match the player gets points and tapped image and name will be removed from lists. When not match I reset the items background colors like below:

    foreach (var item1 in ImageItems)
    {
        item.BGColor = Color.White;
    }
    
    foreach (var item2 in NameItems)
    {
        item.BGColor = Color.White;
    }
    OnPropertyChanged("NameMatchImagItems");
    OnPropertyChanged("NameMatchNameItems");
    

    After this point, multiple images are highlighting and sometimes when selecting an image on the top name on the below list is automatically highlighting. If you have time, can you please download the sample and have a look? I tried my best, but no luck.

  • SreeeeSreeee INMember ✭✭✭✭✭
    edited December 4 Accepted Answer

    Cause:
    I have set the ItemsSource of two flowlistview with the same source _allItems !!

    Got solution from my below SO thread:
    https://stackoverflow.com/questions/59152318/xamarin-forms-flowlistview-item-tapping-issue

Sign In or Register to comment.