question

mokhtarsoholi-9665 avatar image
0 Votes"
mokhtarsoholi-9665 asked mokhtarsoholi-9665 commented

Draw and select text

Hi,
I want to create a game application.
This application have many character i want to select this character please see below picture

99195-img-20210524-wa0040.jpg



How can do it like picture?

dotnet-xamarin
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

KyleWang-MSFT avatar image
0 Votes"
KyleWang-MSFT answered mokhtarsoholi-9665 commented

Hi mokhtarsoholi-9665,

Welcome to our Microsoft Q&A platform!

To create such a "word search" app, here are some tips you can refer to.

First you can use control Label to show the characters and create a Grid to host all the Labels.

 public MainPage()
 {
     InitializeComponent();
     // 4x4 grid
     var characters = new List<string> { "A", "I", "D", "A", "D", "P", "O", "S", "G", "I", "P", "V", "F", "F", "E", "J" };
     CreateGrid(characters);
 }
    
 void CreateGrid(List<string> list)
 {
     var grid = new Grid();
     grid.BackgroundColor = Color.White;
     grid.HorizontalOptions = LayoutOptions.FillAndExpand;
     int order = (int)Math.Sqrt(list.Count);
     for (int i = 0; i < order; i++)
     {
         for (int j = 0; j < order; j++)
         {
             grid.RowDefinitions.Add(new RowDefinition { Height = new GridLength(1, GridUnitType.Auto) });
             var label = new Label { Text = list[i * order + j] };
             label.BackgroundColor = Color.Yellow;
             label.HorizontalOptions = LayoutOptions.FillAndExpand;
             label.VerticalOptions = LayoutOptions.FillAndExpand;
             label.HorizontalTextAlignment = TextAlignment.Center;
             label.VerticalTextAlignment = TextAlignment.Center;
             label.FontSize = 30;
             label.HeightRequest = 100;
             label.WidthRequest = 100;
             grid.Children.Add(label, j, i);
         }
         grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(1, GridUnitType.Auto) });
     }
     Content = new StackLayout { Children = { grid }, HorizontalOptions = LayoutOptions.FillAndExpand, VerticalOptions = LayoutOptions.FillAndExpand };
 }

If you want to judge whether the word selected by your finger is in the specified word list, you can refer to this documentation: Invoking Events from Effects, which explains how to monitor "finger press, move and release".

You only need to get the corresponding Label which the finger pressed and released. Then check whether the two Labels are on the same line, and whether the word composed of characters on this line is in the word list.

Regards,
Kyle


If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

· 5
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

thanks for you answer do you know project like my game in github ?

0 Votes 0 ·

@mokhtarsoholi-9665 Sorry, I could not provide any github project. If you want this "create a Grid" demo, I can upload it to Github.

0 Votes 0 ·

i dont know how can i draw highlight and select this character for examlpe my word is ball and we are b a l l when i toch and drag on this word i need select this.
its my challange

0 Votes 0 ·
Show more comments