Windows 2012 Hosting - MVC 6 and SQL 2014 BLOG

Tutorial and Articles about Windows Hosting, SQL Hosting, MVC Hosting, and Silverlight Hosting

Silverlight 5 Hosting - ASPHostPortal :: Telerik RadBarCode in SilverLight 5 Via WCF Service

clock November 29, 2012 08:03 by author Jervis

In this article let's concentrate on another Silverlight application, whereby communicating with a WCF Service to perform some operation.

The Telerik Rad Controls for Silverlight can be found from http://www.telerik.com/products/silverlight/controls.aspx.

The Rad Window is used to display the output in a nice and enhanced UI.

Question: What is RadBarCode?

In simple terms "It provides light weighted and easy systematic approach to generate bar-codes, it used to ensure unique id given to each product when evaluating".

Let's get this implemented practically for a better idea of this!!!

Step 1: The complete code of the IService1.cs looks like this.

using System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Runtime.Serialization;
using
System.ServiceModel;
using
System.ServiceModel.Web;
using
System.Text;
namespace
Wcf_Rad_Bar
{
    // NOTE: You can use the "Rename" command on the "Refactor" menu to change the interface name "IService1" in both code and config file together.
    [ServiceContract]
    public interface IService1
    {
        [OperationContract]
        int bar(int a);
    }
}


Step 2: The complete code of the Service1.svc.cs looks like this.

using System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Runtime.Serialization;
using
System.ServiceModel;
using
System.ServiceModel.Web;
using
System.Text;
namespace
Wcf_Rad_Bar
{
    // NOTE: You can use the "Rename" command on the "Refactor" menu to change the class name "Service1" in code, svc and config file together.
    public class Service1 : IService1
    {
        public int bar(int a)
        {
            return a;
        }
    }
}


Step 3 : The complete code of the Web.Config looks like this.

<?xml version="1.0"?>
<
configuration>
  <system.web>
    <compilation debug="true" targetFramework="4.0" />
  </system.web>
  <system.serviceModel>
    <behaviors>
      <serviceBehaviors>
        <behavior>
          <!-- To avoid disclosing metadata information, set the value below to false and remove the metadata endpoint above before deployment -->
          <serviceMetadata httpGetEnabled="true"/>
          <!-- To receive exception details in faults for debugging purposes, set the value below to true.  Set to false before deployment to avoid disclosing exception information -->
          <serviceDebug includeExceptionDetailInFaults="false"/>
        </behavior>
      </serviceBehaviors>
    </behaviors>
    <serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
  </system.serviceModel>
 <system.webServer>
    <modules runAllManagedModulesForAllRequests="true"/>
  </system.webServer>
</
configuration
>

Step 4 : The complete code of the Clientaccesspolicy.xml looks like this (to avoid cross domain problem in Silverlight).

<?xml version="1.0" encoding="utf-8"?>
<
access-policy>
    <cross-domain-access>
        <policy>
            <allow-from http-request-headers="SOAPAction">
                <domain uri="*"/>
            </allow-from>
            <grant-to>
                <resource path="/" include-subpaths="true"/>
            </grant-to>
        </policy>
    </cross-domain-access>
</
access-policy
>

Step 5 : The complete code of the MainPage.xaml looks like this. 

<UserControl x:Class="Rad_Bar_App.MainPage"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
              mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
    <Grid x:Name="LayoutRoot" Width="628" Height="452">
        <telerik:RadBarcode128 Name="radBar1"
                               ShowChecksum="False"
                               Margin="104,0,113,189"
                               Height="89"
                               VerticalAlignment="Bottom">
       </telerik:RadBarcode128>
        <TextBlock Height="23"
                   HorizontalAlignment="Left"
                   Margin="191,12,0,0"
                   Name="textBlock1" Text="Please Enter Bar Code Number"
                   FontFamily="Verdana"
                   FontSize="15"
                   VerticalAlignment="Top" />
         <TextBox Height="23"
                HorizontalAlignment="Left"
                 Margin="248,41,0,0"
                 Name="textBox1"
                 VerticalAlignment="Top"
                 Width="120" />
        <Button Content="Send BarCode"
                FontFamily="Verdana"
                Background="DeepSkyBlue"
                FontSize="15"
                Height="23"
                HorizontalAlignment="Left"
                Margin="235,82,0,0"
                Name="button1"
                VerticalAlignment="Top"
                Width="133"
                Click="button1_Click"/>
         <telerik:RadBarcode93 Name="radBar93"
                             Margin="104,336,113,22" ShowChecksum="False">
         </telerik:RadBarcode93>
       <TextBlock Height="23"
                   HorizontalAlignment="Left"
                   Margin="235,289,0,0"
                   Name="textBlock2"
                   Text="RadBarCode93"
                   FontFamily="Verdana"
                   FontSize="15"
                   VerticalAlignment="Top"
                   Width="170"
                   FontWeight="Bold"
                   Visibility="Collapsed"
                   /> 
        <TextBlock Height="23"
                   HorizontalAlignment="Left"
                   Margin="234,129,0,0"
                   Name="textBlock3"
                   Text="RadBarCode128"
                   FontFamily="Verdana"
                   FontSize="15"
                   FontWeight="Bold"
                   VerticalAlignment="Top"
                   Width="134"
                   Visibility="Collapsed"/>
    </Grid>
</
UserControl
>

Step 6 : The complete code of the MainPage.xaml.cs looks like this.

using System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Net;
using
System.Windows;
using
System.Windows.Controls;
using
System.Windows.Documents;
using
System.Windows.Input;
using
System.Windows.Media;
using
System.Windows.Media.Animation;
using
System.Windows.Shapes;
using
Telerik.Windows.Controls;
using
Rad_Bar_App.ServiceReference1;
namespace
Rad_Bar_App
{    public partial class MainPage : UserControl
  {
        public MainPage()
        {
            InitializeComponent();
        }
       private void bar_Call(object sender, barCompletedEventArgs e)
        {
            radBar1.Visibility = System.Windows.Visibility.Visible;
            radBar93.Visibility = System.Windows.Visibility.Visible;
            radBar1.Text = e.Result.ToString();
            radBar93.Text = e.Result.ToString();
            textBlock2.Visibility = System.Windows.Visibility.Visible;
            textBlock3.Visibility = System.Windows.Visibility.Visible;
        }
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            textBlock2.Visibility = System.Windows.Visibility.Collapsed;
            textBlock3.Visibility = System.Windows.Visibility.Collapsed;
            radBar1.Visibility = System.Windows.Visibility.Collapsed;
            radBar93.Visibility = System.Windows.Visibility.Collapsed;
            if (string.IsNullOrEmpty(textBox1.Text))
            {
                RadWindow.Alert("Please Enter Some Values");
           }
            else
            {
                Service1Client obj_Client = new Service1Client();
                obj_Client.barCompleted += new EventHandler<barCompletedEventArgs>(bar_Call);
                obj_Client.barAsync(Convert.ToInt32(textBox1.Text));
                textBox1.Text = "";
            }
        }
    }
}


Step 7 : The output of the application looks like this.

Step 8 : The output of the Nothing Entered Application looks like this.


Step 9 : The output of the BarCodeEntered Application looks like this.

 



Silverlight Hosting - ASPHostPortal :: What You Need to Know When Selecting a Grid

clock October 11, 2012 07:20 by author Jervis

Types of Grids

One of the most common misconceptions is the notion that a grid is a grid. In reality, there are several different types of grids and choosing the right one for your needs can help save substantial time and effort. Choosing the wrong grid can result in tremendous effort to make it work the way you need, which is quite frustrating. We will look at the different types of grids and the ways in which they are typically used.

Cell-oriented Grids

-
No assumptions on layout - Cell-oriented grids do not make any assumptions on the layout of data. They work very well when you wish to have complete control over the layout. They allow you to display data that flows over multiple cells and embed controls such as charts that occupy several underlying cells. You can mix different kinds of cells in the same column.

-
Excel-like behavior - Each cell is independent of other cells. Commonly, you're able to set 50 different attributes on each cell.

-
Formula support - Cell-oriented grids typically offer support for cell-level formulas, similar to Excel.

-
No assumptions on data source - Cell-oriented grids do not expect data to be in a certain format. They allow data to be provided on demand from any source. Binding to data usually involves the implementation of simple callbacks.

Data-bound Grid Controls

-
Homogenous columns - Data-bound grid controls assume that data in a column will be the same type. They work best when most of your data comes from a straight tabular data source and can be displayed in the same layout. They do not work well if you wish to have more control over the layout of your display.

-
Binding to standard types - Data-bound grid controls can be bound to any standard data source with a few lines of code.

-
Rich metadata - Data-bound grids utilize type metadata and other information available from data-binding interfaces. Operations such as sorting, filtering, and grouping are also easier to implement with data-bound grids because of this rich metadata.

-
Support for editing - Support for editing is implemented in most data-bound grid controls. If the backing data store supports editing, adding new rows, and deleting current rows, such support will automatically become available in data-bound grids.

-
Support for automatic updates - Data-bound grid controls can automatically display changes to the data source to which they are bound, provided the data source implements appropriate interfaces.

-
Business objects - Data-bound grid controls support displaying data in business objects, provided such data will support one of the commonly used .NET data-binding interfaces.

-
Delegating common operations to the server - It is typically desirable to delegate such operations to the server. This is the default behavior with most controls.

-
Support for expressions or formulas - Data-bound grid controls do not typically support cell-level formula calculations (like Excel). They instead offer unbound columns where simple expressions may be used to calculate the displayed value. If you need Excel-like formulas, then a cell-oriented grid is a better choice.

-
Displaying related data - Data-bound grids that support displaying related information display such data inline. This is referred to as a hierarchical display or nested table. It is possible for a hierarchical grid to support editing and differing levels in nested tables.

-
Displaying foreign key references - When you have a foreign key relationship, data-bound grid controls should easily display values from the related table.

-
Displaying grouped data - Grouping classifies a list of data based on one or more fields. Data-bound grids can support grouping, along with custom summaries and data updates with multiple field groupings.

Pivot Grids

Pivot grids are very powerful and allow for the display and analysis of massive amounts of data in a summarized, condensed format. Please be sure to test with at least five times the data you expect to work with (both rows and columns). Also, test with several grouping levels on both the row and column axes.

Tree Grids

Tree grids resemble tree controls, but instead of displaying just one column of information, as with a typical tree, they display additional attributes as additional columns. Test for editing and load-on-demand support.

 



Silverlight 5 Hosting - ASPHostPortal :: Telerik Rad HtmlPlaceHolder in Silverlight 5 Via WCF Service

clock September 7, 2012 09:08 by author Jervis

Today, in this article let's concentrate on another Silverlight application, whereby communicating with a WCF Service to perform some operation.

The Telerik Rad Controls for Silverlight can be found from
http://www.telerik.com/products/silverlight/overview.aspx.

What is RadHtmlPlaceHolder?


In simple terms "It is the special controls which enables to render external WebPages into Silverlight App".


Let's get this implemented practically for a better idea of this!!!


Step 1: The complete code of the IService1.cs looks like this:


using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Web;
using System.Text;

namespace Wcf_RadPlaceHolder
{

     // NOTE: You can use the "Rename" command on the "Refactor" menu to change the interface name "IService1" in both code and config file together.
     [ServiceContract]
     public interface IService1
     {

          [OperationContract]
          string url(string a);
     }
}


Step 2: The complete code of the Service1.svc.cs looks like this:


using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Web;
using System.Text;

namespace Wcf_RadPlaceHolder
{
     // NOTE: You can use the "Rename" command on the "Refactor" menu to change the class name "Service1" in code, svc and config file together.
     public class Service1 : IService1
     {
          public string url(string a)
          {
               return a;
          }
     }
}


Step 3: The complete code of the Web.Config looks like this
:

<?xml version="1.0"?>
<configuration>

   <system.web>
      <compilation debug="true" targetFramework="4.0" />
   </system.web>
   <system.serviceModel>
      <behaviors>
        <serviceBehaviors>
          <behavior>
             <!-- To avoid disclosing metadata information, set the value below to false and remove the metadata endpoint above before deployment -->
             <serviceMetadata httpGetEnabled="true"/>
             <!-- To receive exception details in faults for debugging purposes, set the value below to true. Set to false before deployment to avoid disclosing exception information -->
             <serviceDebug includeExceptionDetailInFaults="false"/>
          </behavior>
         </serviceBehaviors>
      </behaviors>
      <serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
   </system.serviceModel>
   <system.webServer>
      <modules runAllManagedModulesForAllRequests="true"/>
    </system.webServer>

</configuration>


Step 4: The complete code of the Clientaccesspolicy.xml looks like this (to avoid a cross domain problem in Silverlight):


<?xml version="1.0" encoding="utf-8"?>
<access-policy>
   <cross-domain-access>
     <policy>
       <allow-from http-request-headers="SOAPAction">
         <domain uri="*"/>
       </allow-from>
       <grant-to>
         <resource path="/" include-subpaths="true"/>
       </grant-to>
      </policy>
   </cross-domain-access>
</access-policy>


Step 5: The complete code of the MainPage.xaml looks like this:


<UserControl x:Class="RadPlaceHolderApplication.MainPage"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:mc=http://schemas.openxmlformats.org/markup-compatibility/2006
              xmlns:telerik=http://schemas.telerik.com/2008/xaml/presentation
              mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
       <Grid x:Name="LayoutRoot">
            <telerik:RadHtmlPlaceholder x:Name="placeHolder1"
                                        ScrollViewer.HorizontalScrollBarVisibility="Visible"
                                        ScrollViewer.VerticalScrollBarVisibility="Visible"
                                        Margin="11,74,13,0" />
        <TextBlock Height="23"
                   HorizontalAlignment="Left"
                   Margin="34,16,0,0"
                   Name="textBlock1"
                   Text="Please Enter Web URL: "
                   FontFamily="Verdana"
                   FontSize="15"
                   VerticalAlignment="Top" />

        <TextBox Height="23"
                 HorizontalAlignment="Left"
                 Margin="219,16,0,0"
                 Name="textBox1"
                 VerticalAlignment="Top"
                 Width="212" />

        <Button Content="Go"
                Background="DeepSkyBlue"
                FontFamily="Verdana"
                FontSize="15"
                Height="23"
                HorizontalAlignment="Left"
                Margin="429,15,0,0"
                Name="button1"
                VerticalAlignment="Top"
                Width="75"
                Click="button1_Click"/>
    </Grid>
</UserControl>


Step 6: The complete code of the MainPage.xaml.cs looks like this:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Telerik.Windows.Controls;
using RadPlaceHolderApplication.ServiceReference1;

namespace RadPlaceHolderApplication
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private void url_Call(object sender, urlCompletedEventArgs e)
        {
            placeHolder1.SourceUrl = new Uri(e.Result.ToString(), UriKind.RelativeOrAbsolute);
        }

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            if (string.IsNullOrEmpty(textBox1.Text))
            {
                MessageBox.Show("Please Enter Some Values", "RadHtmlPlaceHolder- WCF", MessageBoxButton.OKCancel);
            }
            else
            {
                objClient.urlCompleted += new EventHandler<urlCompletedEventArgs>(url_Call);
                objClient.urlAsync(textBox1.Text);
            }

        }

        #region Instance Variables
        Service1Client objClient = new Service1Client();
        #endregion

    }
}

Step 7: The output of the application looks like this:



Step 8: The output of the Nothing Entered Application looks like this:




Step 9: The output of URL Entered Application looks like this:




Hope it helps!



Silverlight 5 Hosting - ASPHostPortal :: How to Debug XAML Bindings in Silverlight 5

clock June 13, 2012 08:55 by author Jervis

The example demonstrated here implements basic XAML data binding. Below we have specified both the scenario when binding is correct and incorrect.

In below example we have given a simple binding for DataGrid.


When Binding is Correct:




Now you can apply a breakpoint to the binding syntax. Once the break point is applied, it hits the breakpoint whenever push and pull is triggered for that control. The below image shows the breakpoint applied within XAML




The XAML editor will not allow you to set breakpoint anywhere else other than Binding syntax.

Once Breakpoint is set, start debugging and wait for the compiler to hit the breakpoint.



You can find the debug information from Local tab.




The information shows up a BindingState object holding complete binding context information of the control. As in the above image, the BindingState value is UpdatingTarget so this way it shows that the binding is pushing data to control.


Going through the debugging information, it shows the complete picture on the nature of data and binding




Now another thing to know is, on TwoWay binding scenario once you change the data, The breakpoint again gets a hit as the binding source is getting updated. And the debug information shows the Binding state as Updating Source status. The breakpoint again gets a hit as the binding source is getting updated. And the debug information shows the Binding state as Updating Source status.




When Binding is Incorrect:


When binding is incorrect you will get the error while debugging the binding.




This will help you to find the incorrect bindings in your XAML.

Hope this helps you to get acquainted with the new feature of Silverlight 5

Reasons why you must trust ASPHostPortal.com

Every provider will tell you how they treat their support, uptime, expertise, guarantees, etc., are. Take a close look. What they’re really offering you is nothing close to what
ASPHostPortal does. You will be treated with respect and provided the courtesy and service you would expect from a world-class web hosting business.

You’ll have highly trained, skilled professional technical support people ready, willing, and wanting to help you 24 hours a day. Your web hosting account servers are monitored from three monitoring points, with two alert points, every minute, 24 hours a day, 7 days a week, 365 days a year. The followings are the list of other added- benefits you can find when hosting with us:

- DELL Hardware
Dell hardware is engineered to keep critical enterprise applications running around the clock with clustered solutions fully tested and certified by Dell and other leading operating system and application providers.
- Recovery Systems
Recovery becomes easy and seamless with our fully managed backup services. We monitor your server to ensure your data is properly backed up and recoverable so when the time comes, you can easily repair or recover your data.

- Control Panel
We provide one of the most comprehensive customer control panels available. Providing maximum control and ease of use, our Control Panel serves as the central management point for your ASPHostPortal account. You’ll use a flexible, powerful hosting control panel that will give you direct control over your web hosting account. Our control panel and systems configuration is fully automated and this means your settings are configured automatically and instantly.

- Excellent Expertise in Technology
The reason we can provide you with a great amount of power, flexibility, and simplicity at such a discounted price is due to incredible efficiencies within our business. We have not just been providing hosting for many clients for years, we have also been researching, developing, and innovating every aspect of our operations, systems, procedures, strategy, management, and teams. Our operations are based on a continual improvement program where we review thousands of systems, operational and management metrics in real-time, to fine-tune every aspect of our operation and activities. We continually train and retrain all people in our teams. We provide all people in our teams with the time, space, and inspiration to research, understand, and explore the Internet in search of greater knowledge. We do this while providing you with the best hosting services for the lowest possible price.

- Data Center

ASPHostPortal modular Tier-3 data center was specifically designed to be a world-class web hosting facility totally dedicated to uncompromised performance and security
- Monitoring Services
From the moment your server is connected to our network it is monitored for connectivity, disk, memory and CPU utilization – as well as hardware failures. Our engineers are alerted to potential issues before they become critical.

- Network
ASPHostPortal has architected its network like no other hosting company. Every facet of our network infrastructure scales to gigabit speeds with no single point of failure.

- Security
Network security and the security of your server are ASPHostPortal’s top priorities. Our security team is constantly monitoring the entire network for unusual or suspicious behavior so that when it is detected we can address the issue before our network or your server is affected.

- Support Services
Engineers staff our data center 24 hours a day, 7 days a week, 365 days a year to manage the network infrastructure and oversee top-of-the-line servers that host our clients’ critical sites and services.



Silverlight 5 Hosting - ASPHostPortal :: Playing HTML5 Video with fall back for IE8/IE7 and earlier versions of other browsers using Silverlight

clock May 30, 2012 08:12 by author Jervis

One of the popular HTML5 tags is the video tag. The ability to play videos without depending on a plugin is something that excites web developers to a great extent and no wonder you end up seeing video demos in all HTML5 conferences.

Now, coming to HTML5 Video, the tag itself is simply <video id=”ID” src=”FILENAME.mp4/ogv/webm” > in the simplest form. This also means that the video needs to be H.256 encoded MP4 format or some of the other formats as mentioned above. For a detailed specification on this, check this
Wikipedia article

HTML5 video is supported by all the modern browsers such as IE9 (currently in RC stage), Mozilla Firefox 4 and Chrome latest versions. Here below is a simple example of a HTML5 video tag and the screen shot of how it looks like in IE9 RC


<!DOCTYPE html>
<head></head>
<body>
<h1>This is a sample of an HTML5 Video</h1>
<video src="video.mp4" id="myvideo">Your browser doesn’t support this currently</video>
</body>
</html>




You can add attributes to the video tag such as “autoplay” which will automatically start playing the video. Also, you can specify “poster” to display an initial picture before the video starts playing etc., but I am not going into those for now.


This would play well in the modern browsers as mentioned above. However, if the end users are viewing this page from an earlier version of browsers such as IE8/IE7 or IE6, this video wouldn’t play. Whatever text that is specified between the video tags, would just show up.




Note: for demo purposes, I went to the IE9 developer toolbar and chose IE8 as Browser Mode to exhibit this legacy behaviour.


However, in the interest of serving the larger community of users who visit the site, we would like to have a fall back mechanism for playing videos on older version of browsers.


Now, Silverlight is supported in IE6/7 & 8 and other browsers too. If we can have the same video encoded for Silverlight, we can put the fall-back code, as follows:-


<video src="videos/video.mp4" id="myvideo">
<object height="252" type="application/x-silverlight-2" width="448">
<param name="source" value="resources/player.xap">
<param name="initParams" value="deferredLoad=true, duration=0, m=http://localhost/DemoSite/videos/video.mp4, autostart=false, autohide=true, showembed=true, postid=0" />
<param name="background" value="#00FFFFFF" />
</object>

</video>

Note, this sample uses a Silverlight XAP file with the same video and uses the object tag to embed it instead of the HTML5 video tag.


So, when I now run this sample and switch to IE8 (using the IE9 Developer toolbar’s Browser Mode), I get



and when clicking on the “Play” icon,



Note, there are multiple ways to play videos in Silverlight and this is one of the ways. For a complete list of Silverlight samples, visit http://www.silverlight.net/learn/

Also, we can use Flash to play video in the fall-back mechanism as well.

Thus, we can create a fall-back mechanism for playing HTML5 videos for the older browsers and hence ensure that the end users get to experience the same.

Cheers !!! Try Silverlight 5 Hosting with ASPHostPortal.com

 



Silverlight 5 Hosting - ASPHostPortal :: Breakpoints on Xaml in Silverlight 5

clock May 14, 2012 09:53 by author Jervis

Silverlight 5 Beta brings the enormously useful ability to set a break point in your Xaml where you have a data binding. This can greatly simplify debugging and fixing binding issues.



To see this, create a new Silverlight 5 project and set up the Xaml to have 5 rows and 2 columns. Place the title in the first row (spanning both columns) and prompts in the next 4 rows. The prompts are


- Full name

- Address
- Phone
- Email

Add four TextBlocks in the second column to display the values that will correspond to these prompts. The Xaml for the four prompts looks like this:


<TextBlock
    Grid.Column="1"
    Grid.Row="1"
    Margin="5"
    HorizontalAlignment="Left"
    VerticalAlignment="Center"
    Text="{Binding FullName}" />
<TextBlock
    Grid.Column="1"
    Grid.Row="2"
    Margin="5"
    HorizontalAlignment="Left"
    VerticalAlignment="Center"
    Text="{Binding FullName}" />
<TextBlock
    Grid.Column="1"
    Grid.Row="2"
    Margin="5"
    HorizontalAlignment="Left"
    VerticalAlignment="Center"
    Text="{Binding Address}" />
<TextBlock
    Grid.Column="1"
    Grid.Row="4"
    Margin="5"
    HorizontalAlignment="Left"
    VerticalAlignment="Center"
    Text="{Binding PhoneNumber}" />
<TextBlock
    Grid.Column="1"
    Grid.Row="4"
    Margin="5"
    HorizontalAlignment="Left"
    VerticalAlignment="Center"
    Text="{Binding Email}" />

To make this work, of course, we need a class and an instance to bind to. Begin by creating a new class, Person,


public class Person
{
    public string FullName { get; set; }
    public string Address { get; set; }
    public string Phone { get; set; }
    public string Email { get; set; }
}

In MainPage.xaml.cs create an instance of Person, and set that instance to be the data context for the bindings,

public MainPage()
{
    InitializeComponent();
    var per = new Person()
    {
        FullName = "Jesse Liberty",
        Address = "100 Main Street, Boston, MA",
        Email = "[email protected]",
        Phone = "617-888-1243"
    };
    this.DataContext = per;
}

When you run this you’ll find that three of the four bindings work well, but the phone number is not displayed. Set a break point in the Xaml folder on the binding for the PhoneNumber and run the application. When you hit the break point examine the locals window as shown in the illustration to the right.



Note that there is an error message. By clicking on the message you can open a text reader for the entire error message, as shown in the next figure to the right.



The error message indicates that there is no property PhoneNumber in the type Person, and sure enough, a quick check of the code shows that the property is just Phone.

Change the binding from PhoneNumber to Phone and the program works as expected

 



Silverlight 5 Hosting - ASPHostPortal :: PivotViewer Custom DetailPaneStyle in Silverlight 5

clock April 24, 2012 07:08 by author Jervis

One of the added API features of the new Silverlight 5 PivotViewer is the ability to define a custom detail pane. It is rather simple to replace the style with your own, however, then you are left with the task of implementing several features that you most likely want to keep (like when to show and hide your detail pane). There are also a few other states and navigation features that would also be nice to keep. We will look at how you can replace the default implementation with the smallest amount of code and keep the functionality that you will want to keep.

In order to keep from reinventing the wheel when implementing our new detail pane, we are going to start off with the
PivotViewerDetailPane control. This is the control that is being used in the default implementation. By using our own instance of the control, we are able to take advantage of all of that hard work the PivotViewer team has done for us.

The first thing we need to do is see how to implement our own copy of the control. You can override the default implementation by setting the DetailPaneStyle property on the PivotViewer. Here is what an example would look like :


<pivot:PivotViewer x:Name="pViewer">
    <pivot:PivotViewer.DetailPaneStyle>
        <Style TargetType="pivot:PivotViewerDetailPane">
        </Style>
    </pivot:PivotViewer.DetailPaneStyle>
</pivot:PivotViewer>


This simply sets the
DetailPaneStyle to a basic implementation of the PivotViewerDetailPane. However, if we run our example, we soon see that it is close, but not quite the default we are looking for. Now the good news is that we have proved to we have overridden the default.



With a bit more research, you will see that you need to set some default colors. Here are the colors that are originally set:


<
pivot:PivotViewer.DetailPaneStyle>
    <Style TargetType="pivot:PivotViewerDetailPane">
        <Setter Property="Foreground"
                Value="{Binding Foreground,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="Background"
                Value="{Binding Background,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="BorderBrush"
                Value="{Binding BorderBrush,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="AccentColor"
                Value="{Binding AccentColor,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="Background"
                Value="{Binding SecondaryBackground,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="ControlBackground"
                Value="{Binding ControlBackground,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="SecondaryForeground"
                Value="{Binding SecondaryForeground,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="PrimaryItemValueBackgroundColor"
                Value="{Binding PrimaryItemValueBackgroundColor,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
        <Setter Property="SecondaryItemValueBackgroundColor"
                Value="{Binding SecondaryItemValueBackgroundColor,
                RelativeSource={RelativeSource Mode=FindAncestor,
                AncestorType=pivot:PivotViewer}}"
/>
    </Style>
</pivot:PivotViewer.DetailPaneStyle>


As you can see, the detail pane is using the new Silverlight 5 Feature RelativeSource binding to carry the theme colors of the PivotViewer to the detail pane. Obviously, this gives you an opportunity to create your own custom colors if you so choose. If not, it gets us back to the starting point.




Now that we are at a good starting point, let’s figure out what we want to modify. Most of the people I have talked to are only interested in modifying the contents of the detail pane itself and not the entire shell. So we will focus this discussion on the modifying the
ContentTemlate of the PivotViewerDetailPane.



When you replace the
ContentTemplate there are a couple of things you need to remember. The first is the default width of the original template is 190px. The detail pane will grow to accommodate any size that you need, but that is what the default is. The other thing to remember is a bit tricky, and that is the visibility of the contents. If you do not collapse your container by default, then it will be visible while the PivotViewer is loading. It causes a weird user experience and should be handled. We can handle that with a multi-part binding. First we bind the Visibility to the IsShowing property of the PivotViewerDetailPane. We have to write a value converter to change the bool IsShowing to a Visibility. If you haven’t had to do that before, it’s a handy little converter to keep in your toolkit.

public class BoolToVisibilityConverter : IValueConverter
{

    public object Convert(object value,
        Type targetType,
        object parameter,
        System.Globalization.CultureInfo culture)
    {
        if(value is bool)
        {
            return (bool) value ?
                    Visibility.Visible :
                    Visibility.Collapsed;
        }

        return Visibility.Collapsed;
    }

    public object ConvertBack(object value,
        Type targetType,
        object parameter,
        System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}


Now you are able to set up your custom detail pane. Here is very simple example using a dummy data set that has a
Color property in it. We are replacing the default content with an Ellipse that is filled with the Color property of our object.

<Setter Property="ContentTemplate">
    <Setter.Value>
        <DataTemplate>
            <Grid Width="190"
                Visibility="{Binding IsShowing,
                RelativeSource={RelativeSource
                AncestorType=pivot:PivotViewerDetailPane},
                Converter={StaticResource boolConv},
                FallbackValue=Collapsed}">
                <Ellipse Width="100" Height="100"
                         Fill="{Binding Color}"
                         VerticalAlignment="Top"
                         Margin="0,30,0,0"/>
            </Grid>
        </DataTemplate>
    </Setter.Value>

</Setter>




Obviously this is a rather simplistic detail pane, so feel free to make yours a bit more complex and interesting.


Get Silverlight 5 Hosting with only $2.00/month at ASPHostPortal.com.



Press Release - ASPHostPortal Offers Silverlight 5 Hosting For All New and Existing Customer

clock October 19, 2011 05:26 by author Jervis

ASPHostPortal is a premiere web hosting company that specialized in Windows and ASP.NET-based hosting. Today, we are proud to introduce our new Microsoft product, Silverlight 5 Hosting to all our new and existing customer. For more information about this new product, please visit ASPHostPortal official website at http://www.asphostportal.com.

Silverlight 5 adds more than 40 features to the platform, with additions for both premium content viewers and developers.

Silverlight 5 provides advances in rich media and application development. For media experiences, Silverlight 5 will add GPU-accelerated video decoding to reduce the load on the CPU when streaming HD video. This will allow even netbooks to stream 1080p HD video. Microsoft Silverlight 5 beta also offers a new Microsoft XNA-based interface for delivering stunning 3-D visualizations within applications, along with a host of new features that are designed to enhance developer productivity and end-user experiences.

And the Silverlight TrickPlay feature provides the possibility to play videos at different speeds, it also supports fast-forwarding and rewinding. In addition to all of the above, the new Silverlight 5 will be featuring wireless control of all the media contents by making use of remote controllers.

“We are really excited, we really thankful for our team that works very great. This new features are really amazing.” Said Robert Kruger, CEO of ASPHostPortal.com.

For more details about this product, please visit http://asphostportal.com/Cheap-Silverlight-5-Hosting.aspx.

About ASPHostPortal.com:

ASPHostPortal.com is a hosting company that best support in Windows and ASP.NET-based hosting. ASPHostPortal.com have many great plans that can meet your business requirement. For more details about ASPHostPortal.com, please visit the official site at
http://www.asphostportal.com.



About ASPHostPortal.com

We’re a company that works differently to most. Value is what we output and help our customers achieve, not how much money we put in the bank. It’s not because we are altruistic. It’s based on an even simpler principle. "Do good things, and good things will come to you".

Success for us is something that is continually experienced, not something that is reached. For us it is all about the experience – more than the journey. Life is a continual experience. We see the Internet as being an incredible amplifier to the experience of life for all of us. It can help humanity come together to explode in knowledge exploration and discussion. It is continual enlightenment of new ideas, experiences, and passions


Author Link


Corporate Address (Location)

ASPHostPortal
170 W 56th Street, Suite 121
New York, NY 10019
United States

Sign in