ESRI Legend Control - Show and Hide Sliders

In the ESRI Legend Control, "DataTemplate" can be used to display slider "usercontrol" to control the opacity of the Layer.

 

Here is the XAML content where the slider "usercontrol" is used.

 

      
<esri:Legend Grid.Row="1" x:Name="legendControl" VerticalAlignment="Top" LayerItemsMode="Tree"

ShowOnlyVisibleLayers="False" Margin="5,5,5,5" ><esri:Legend.MapLayerTemplate>

<DataTemplate>

<StackPanel Orientation="Horizontal">

<CheckBox Content="{Binding Label}"

IsChecked="{Binding IsEnabled, Mode=TwoWay}"

IsEnabled="{Binding IsInScaleRange}" >

</CheckBox>

<Slider Maximum="1" Value="{Binding Layer.Opacity, Mode=TwoWay}" Width="50" Loaded="Slider_Loaded" Tag="{Binding Layer}" />

</StackPanel>

</DataTemplate>

</esri:Legend.MapLayerTemplate>

<esri:Legend.LayerTemplate>

<DataTemplate>

<CheckBox Content="{Binding Label}"

IsChecked="{Binding IsEnabled, Mode=TwoWay}"

IsEnabled="{Binding IsInScaleRange}" >

</CheckBox>

</DataTemplate>

</esri:Legend.LayerTemplate>

</esri:Legend>

But what happens, if the user should see Slider usercontrol only for certain Layers and for certain Layers it should NOT be shown ?

There are many ways to do this. But here is one simple method.

In the Slider "usercontrol" add the following event and tag in the XAML content.

Loaded="Slider_Loaded" Tag="{Binding Layer}"

In the code behind simply use some logic like this.

private void Slider_Loaded(object sender, RoutedEventArgs e)
{Slider slider = sender as Slider;
Layer layer = slider.Tag as Layer;
if (layer.ID == "SampleData") slider.Visibility = System.Windows.Visibility.Collapsed;
}
If the "Layer.ID" matches with that "specific layer name", then the slider will not be displayed.

Hope this helps !

Have fun coding :)

Cheers
Adam





 

Get color from HTML color string

Here is a quick code snippet to get color from HTML color string.

private Color GetColorFromString(string inStringColorCode)
{

Color togoColor = Colors.Transparent;
try
{

byte alpha = Convert.ToByte(Convert.ToInt32(inStringColorCode.Substring(0, 2), 16));

byte red = Convert.ToByte(Convert.ToInt32(inStringColorCode.Substring(2, 2), 16));

byte green = Convert.ToByte(Convert.ToInt32(inStringColorCode.Substring(4, 2), 16));

byte blue = Convert.ToByte(Convert.ToInt32(inStringColorCode.Substring(6, 2), 16));

togoColor = Color.FromArgb(alpha, red, green, blue);

}

catch (Exception ex)
{

MessageBox.Show("Error when converting color ARGB code " + inStringColorCode + ". It must be of length 8 characters." + ex.ToString(), "Error", MessageBoxButton.OK);
}
return togoColor;
}

Happy Coding !

Using Events and Delegates in Visual C#.NET

Here are the steps to create events and delegates in .NET.

 

STEP 1:

In the Child Control which raises the event, you should have the following:

public delegate void ZoomtoMapEventHandler(object sender, ClassQueryResultsSet CQRe);

public event ZoomtoMapEventHandler ZoomtoMapEvent;

where the ClassQueryResultsSet is as follows :

public class ClassQueryResultsSet : EventArgs

                {
                                public DataSet QueryResultsDataSet ;
                                public string QueryResultsTableName ;
                                public string KeyFieldName ;
                                public ClassQueryResultsSet()
                                {
                                                //
                                                // TODO: Add constructor logic here
                                                //
                                                QueryResultsDataSet = null ;
                                                QueryResultsTableName = null ;
                                                KeyFieldName = "" ;
                                }
                }

Also when invoking the event check for null and do it as shown below:

                                                                if (ZoomtoMapEvent != null)

                                                                {
                                                                                ZoomtoMapEvent(this, Res) ;
                                                                }
                                                                else
                                                                {
                                                                                MessageBox.Show("ZoomtoMapEvent is Null !") ;
                                                                }

STEP 2

In the MAIN PARENT Program, the event is declared like below

x.userControlQuerySingleTable1.ZoomtoMapEvent += new WindowsControlLibrarySingleTable.UserControlQuerySingleTable.ZoomtoMapEventHandler(x.ShowMaptoUser)  ;

 

Also the function into which the control should come in should have the same signature as shown below:

public void ShowMaptoUser(object o, ClassQueryResultsSet e)

{
                MessageBox.Show("Calling ok" + e.QueryResultsTableName) ;
}

Using this events and delegates will come in handy when passing information from one class to another.

Happy coding.

Cheers
Adam

Simple Slideshow using timer, javascript and JQuery

Here is the code to create a simple slideshow using timer, JavaScript and JQuery.

The html file contents should be like this which has all the images to show up.

<div class="galleryImages">
<img src='Images/Slides/0.png' alt="" />
<img src='Images/Slides/1.png' alt="" />
<img src='Images/Slides/2.png' alt="" />
<img src='Images/Slides/3.png' alt="" />
</div>
 The 'galleryImages' class is defined like this.

.galleryImages {
position: relative;
height: 350px;
width:700px;
overflow: hidden;
border:solid;
border-color:black;
border-width:thin;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius: 15px;
border-radius: 15px;
margin:10px;
}
 .galleryImages img {
position: absolute;
top: 0;
left: 0;
}


The JavaScript code should be like this.

var slideShowTimer;
var imageId = 0;
var galleryImages;
var transitionSpeed = 500;
function PerformInitialization() {
SetupTimer();galleryImages = $('.galleryImages img');
}
 function SetupTimer() {
slideShowTimer = setInterval(ChangePhoto, 3000);
}
 function ChangePhoto() {
galleryImages.eq(imageId).stop(true, true).animate({ opacity: 0 }, transitionSpeed);
imageId++;if (imageId >= galleryImages.length) {
imageId = 0;
}galleryImages.eq(imageId).stop(true, false).animate({ opacity: 1 }, transitionSpeed);
}
Make sure to call PerformInitialization() function during "onload" of the body of the html file.

Also make sure to add these "JQuery" references.

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js"></script>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/jquery-ui.min.js"></script>
   
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/flick/jquery-ui.css" rel="stylesheet" type="text/css" />

Have fun. Happy coding.

Cheers
Adam