Win8 consecutive watch Season 2 (1)

The last continuous check was just a first-learned version, and is being optimized ......, This is almost a refactoring.

Season 1

The idea is as follows: 100 icons (10 rows and 10 columns) are marked in the tentative game, and each small icon is displayed with a user control (many advantages are convenient to bind data, link events, and implement animation effects ).

User Control UI code

View Code

    <UserControl.Resources>        <local:BoolVisibilityValueConverter x:Key="boolConverter"></local:BoolVisibilityValueConverter>        <local:PicTypeImgSrcValueConverter x:Key="picTypeImgSrcConverter"></local:PicTypeImgSrcValueConverter>        <Storyboard x:Name="sbShan">            <DoubleAnimation Storyboard.TargetName="transformImg"                             Storyboard.TargetProperty="ScaleX"                             From="0.8" To="1.2" AutoReverse="True"                             Duration="00:00:00.200"                             RepeatBehavior="forever">            </DoubleAnimation>            <DoubleAnimation Storyboard.TargetName="transformImg"                             Storyboard.TargetProperty="ScaleY"                             From="0.8" To="1.2" AutoReverse="True"                             Duration="00:00:00.200"                             RepeatBehavior="forever">            </DoubleAnimation>        </Storyboard>    </UserControl.Resources>    <Grid>        <Image Source="{Binding PicType, Converter={StaticResource picTypeImgSrcConverter }}" Visibility="{Binding IsAlive, Converter={StaticResource boolConverter}}">            <Image.RenderTransform>                <ScaleTransform x:Name="transformImg"></ScaleTransform>            </Image.RenderTransform>        </Image>    </Grid>

Two attributes are bound to an image. One PicType is the image path.

View Code

Public class PicTypeImgSrcValueConverter: IValueConverter {// Convert Model to UI public object Convert (object value, Type targetType, object parameter, string language) {int picType = (int) value; string fileName = "ms-appx: // Images/" + picType + ". png "; return new BitmapImage (new Uri (fileName);} public object ConvertBack (object value, Type targetType, object parameter, string language) {throw new NotImplementedException ();}}

Bind another attribute to the image's Visibility: True and False

View Code

// Convert Model to UI public object Convert (object value, Type targetType, object parameter, string language) {bool B = (bool) value; return B? Visibility. Visible: Visibility. Collapsed;} public object ConvertBack (object value, Type targetType, object parameter, string language) {throw new NotImplementedException ();}

The object class bound to each image is

View Code

    public class LLKBlock:INotifyPropertyChanged    {        private void FirePropertyChanged(string PropertyName)        {            if (PropertyChanged != null)            {                 PropertyChanged(this,new PropertyChangedEventArgs(PropertyName));            }        }        public event PropertyChangedEventHandler PropertyChanged;        private int x;        public int X        {            get            {                return x;            }            set            {                x = value;                FirePropertyChanged("X");            }        }        private int y;        public int Y        {            get            {                return y;            }            set            {                y=value;                FirePropertyChanged("Y");            }        }        private bool isAlive;        public bool IsAlive        {            get            {                return isAlive;            }            set            {                isAlive=value;                FirePropertyChanged("IsAlive");            }        }        private int picType;        public int PicType        {            get            {                return picType;            }            set            {                picType=value;                FirePropertyChanged("PicType");            }        }    }

To inherit the INotifyPropertyChanged interface, implement the interface, and define a method to send a notification to the client that the property value has changed.

X and Y are the columns and rows that are bound to 10 rows and 10 columns, which is equivalent to coordinate. IsAlive is the Visibility bound to whether the Image is displayed. PicType is the Image path bound to the Int type, then we need to convert it to the actual image path that can be bound.

View Code

Public class PicTypeImgSrcValueConverter: IValueConverter {// Convert Model to UI public object Convert (object value, Type targetType, object parameter, string language) {int picType = (int) value; string fileName = "ms-appx: // Images/" + picType + ". png "; return new BitmapImage (new Uri (fileName);} public object ConvertBack (object value, Type targetType, object parameter, string language) {throw new NotImplementedException ();}}

 

Animation effects are set for X and Y of the image.

The above mainly sets the effect of an image.

The next step is to combine images into a gallery of connected games. (Draw 10 rows and 10 columns to insert each image into each table .)

                for (int i = 0; i < 10; i++)                {                    RowDefinition rowDef = new RowDefinition();                    gridGameField.RowDefinitions.Add(rowDef);                }                for (int i = 0; i < 10; i++)                {                    ColumnDefinition colDef = new ColumnDefinition();                    gridGameField.ColumnDefinitions.Add(colDef);                }                for (int i = 0; i < 10; i++)                {                    for (int j = 0; j < 10; j++)                    {                        LLKImage llkImg = new LLKImage();                        llkImg.DataContext = map[i, j];                        llkImg.Tapped+=llkImg_Tapped;                        gridGameField.Children.Add(llkImg);                        Grid.SetColumn(llkImg, i);                        Grid.SetRow(llkImg, j);                    }                }

The most important thing is to process the matching algorithm of the clicked image. This is mainly based on determining whether there is a barrier between two blocks and combining them.

1. the simplest one is a straight line (a straight line): the horizontal or vertical coordinates of two points are equal (and not a coordinate point), and there is no barrier in the middle.

View Code

Public bool IsDirectConnect (LLKBlock b1, LLKBlock b2) {if (b1.X = b2.X) {// No b1, b2, determine the for (int I = Math. min (b1.Y, b2.Y) + 1; I <Math. max (b1.Y, b2.Y); I ++) {if (data [b1.X, I]. isAlive) {return false ;}} return true;} else if (b1.Y = b2.Y) {for (int I = Math. min (b1.X, b2.X) + 1; I <Math. max (b1.X, b2.X); I ++) {if (data [I, b1.Y]. isAlive) {return false ;}} return true ;}else {return false ;}}

If True is returned, there is no barrier between two points, or the icon Visibility between two points is False.
2. Two patterns can be connected by a line at a time (two straight lines are connected): their horizontal or vertical coordinates are not equal. It is a rectangle formed by the horizontal and vertical coordinates of two graph blocks, and whether there is a barrier between the other two points of the rectangle and the two graph blocks (based on a straight line) to determine whether two blocks can be connected through a line.

3. Two patterns can be connected by line breaks (three straight lines ):...... For more information, see 1 and 2.

Sample Code