00:01So what I'd like to now is introduce Jeff Jackson who's going to step us through a glance at the ArcGIS Viewer for Windows.
00:07This is one of these new configurable applications. Jeff.
00:13So what are we looking at here?
00:15This is a dashboard style application that's built with the Windows Viewer, and it's representative of the type of application...
00:25...that's used to monitor dynamic features, in this case buses.
00:29So what we have is several informational displays or widgets as Euan called them...
00:35...and those guys are getting updated at regular intervals when the data behind them changes.
00:40So in this particular case, all of the widgets are either directly or indirectly connected to a single data source...
00:48...which is a feature service that is those buses.
00:52So as the application's running, what happens is, those buses, those features get updated...
00:59...and we see those updates reflected in the various widgets on the screen.
01:05So, for example, when the positional information changes, we see the buses moving on the map.
01:12We also have a list widget that's showing us the buses sorted by the remaining fuel...
01:17...and so when that attribute changes, you'll see items get repositioned in the list.
01:22And, likewise, we have a feature details widget, histogram widget, and a gauge widget...
01:26...and they're all connected to that same data source.
01:31No someone that uses this type of application in an office or something will typically be staring at it...
01:36...and looking for interesting things to occur.
01:39But widgets are also interactive, so I can, you know, pick up the map and move it.
01:43I can select features, pan and zoom.
01:46I can interact with the list widget, maybe select a bus, zoom to it, highlight it.
01:55Now, the really interesting thing about this application is that it required no coding at all and no editing of configuration files.
02:05The application is using all out-of-the-box widgets that are included with the Windows Viewer...
02:09...and the widgets were all configured interactively.
02:14So let's take a look at how you might do that.
02:19I'll go ahead and close this configuration, and we'll create a new one.
02:23And to create a configuration, the first thing you do is choose the first widget that you want to use.
02:28So we'll use a map.
02:31And I'm going to go ahead and configure the map widget with a map that I used for the previous application configuration.
02:41And I'll go ahead and hit click OK.
02:43Now, just by grabbing that web map and putting it into the application, you can see that the data source was discovered there...
02:51...and brought to life, so the buses start moving right away.
02:55Now the second thing we'll do is we'll add another widget. Let's add the list.
03:01Now the first thing that you configure for the list is you configure the data source that it's connected to.
03:06So right now, our application just has that buses data source, so we'll go ahead and use that.
03:12I'm going to pick the field that I want to sort on, so I'll pick the remaining fuel.
03:17And I can also control how the list items are displayed.
03:20So I can set up a title with fixed text, or I'll actually use an attribute.
03:25We'll use the bus ID, I guess.
03:27I can choose an icon. We'll just use the symbol.
03:31And then I can have an elaborate description or a single field.
03:33I'll just go ahead and use the operator.
03:37I click OK, and now we've got our widget.
03:40Now, if I'm building this application for a large sort of multiscreen scenario, I might pick up the widget and drag it to another screen.
03:49Unfortunately, I only have the one screen here, but I can take advantage of the docking capabilities of the Windows Viewer...
03:54...and I'll just dock that widget right over here.
04:00Let's go ahead and save this configuration now, and I'll give it a name.
04:11Now up to this point, all the widgets that we've looked at are part of those out-of-the-box widgets.
04:18But what about extensions? How can you as developers create new widgets and drop them into this application?
04:26So let's look at that now. I'm going to close our application here.
04:28We'll start up Microsoft's application, Visual Studio.
04:32And in the interest of time, I'm not going to run through the wizard that's going to be included as part of the Runtime SDK.
04:38I've gone ahead and done that, and when I do that, the solution that produces contains two classes.
04:44There's a class for the widget itself, sort of a starting point for your widget.
04:48And then there's another class for the configuration dialog.
04:50So let's quickly look at how we extend the system with a custom widget.
04:56This is actually very similar to the mechanism for extension that Rex showed with the Silverlight viewer earlier.
05:03The idea is that you implement a class and then you export that class...
05:07...and there's some additional export metadata that you can include.
05:11To implement a widget...in this case we derive from user control, and the one important thing...
05:16...the one required thing is that you implement the iWidget interface...
05:20...and which is a simple interface that's actually implemented for you by that template.
05:25So you don't really have to do anything.
05:27Beyond that, to further integrate with the application with some of the built-in widgets and the data sources...
05:33...you implement optional interfaces.
05:35So by implementing iConfigurable, you get a configuration dialog that the end user can use to configure your widget...
05:42...and if you want to connect the widget to the data sources like we saw with the widgets we've looked at already...
05:48...you implement iData Source Consumer.
05:50So before we drill into that, let's take a look at what our widget's going to look like.
05:56So I'll switch to the XAML view, and you can see that the widget I'm building here is a dial...
06:01...and it's really composed of some simple objects like ellipses, there's an arc, this is a rectangle...
06:08...and you can see that I included a rotate transform and gave that a name.
06:12And what I'm going to do is I'm going to use that rotate transform to move the dial...move the needle of the dial...
06:19...as the attribute value changes.
06:21So let's go back to the code behind, and we'll just quickly kind of go over the iData Source Consumer interface.
06:30So the one method that's important here is data source updated.
06:34So that's called by the viewer every time a particular data source updates.
06:38And we're just going to check that data source and say, Hey, is this the one we're interested in?
06:42And if so, we'll call Update.
06:45Now Update is an asynchronous method that's just going to query the data source for the field that we're displaying value for...
06:53...and then we'll take that value and use it to calculate the angle, and then we'll just stuff that angle into the rotate transform...
07:01...and we'll also...we'll put the value into a text block as well.
07:05Now the other thing I mentioned was this class for the configuration dialog.
07:09And I just took the out-of-the-box one, and I added two text boxes for the minimum and maximum values for our dial.
07:16So let's go ahead and build the solution now.
07:19Now when you're developing a custom widget, when you build the solution, it'll actually be deployed locally...
07:26...so that the Windows Viewer can pick it up.
07:30So I've built it, so let's restart the viewer, and we'll go back to the application configuration that we just built...
07:39...with our buses and our list, and I'll switch into configuration mode for this guy...
07:45...and you can see that now I can both configure the widgets that I already have and I can add new widgets.
07:50Now I click the Add Widget button.
07:52Now that widget that we just authored is showing up there.
07:55So let's go ahead and pick that, and I'll choose the data source.
07:59We'll use the buses. I'll choose the field, and we'll use the remaining fuel...
08:04...and we'll have this needle go between zero and 100. Click OK.
08:08And there's our widget.
08:10Just like the built-in widgets, I can drag it into place, save this application configuration off, and we're good to go.
08:17So we looked at...very quickly we looked at the ArcGIS Viewer for Windows, some of the out-of-the-box widgets...
08:25...a lot of what you can do with configuration, and then how you can could extend the system by building a custom widget.
ArcGIS Viewer for Windows
Jeff Jackson demonstrates how to configure and extend ArcGIS Viewer for Windows with custom widgets.
- Recorded: Mar 26th, 2012
- Runtime: 08:36
- Views: 2424
- Published: Apr 19th, 2012
- Night Mode (Off)Automatically dim the web site while the video is playing. A few seconds after you start watching the video and stop moving your mouse, your screen will dim. You can auto save this option if you login.
- HTML5 Video (Off) Play videos using HTML5 Video instead of flash. A modern web browser is required to view videos using HTML5.