Programming4us
         
 
 
Windows Phone

Windows Phone 7: The Silverlight Image Element

2/4/2011 5:57:42 PM
The equivalent program in Silverlight is even simpler. Let’s create a project named SilverlightLocalBitmap. First create a directory in the project to store the bitmap. This isn’t strictly required but it makes for a tidier project. Programmers usually name this directory Images or Media or Assets depending on the types of files that might be stored there. Right-click the project name and choose Add and then New Folder. Let’s name it Images. Then right-click the folder name and choose Add and Existing Item. Navigate to the Hello.png file. (If you’ve created a different bitmap on your own, keep in mind that Silverlight supports only JPEG and PNG files.)

From the Add button choose either Add or Add as Link. If you choose Add, a copy will be made and the file will be physically copied into a subdirectory of the project. If you choose Add as Link, only a file reference will be retained with the project but the file will still be copied into the executable.

The final step: Right-click the bitmap filename and display Properties. Note that the Build Action is Resource. It’s possible to change that Build Action to Content, but let’s leave it for now and I’ll discuss the difference shortly.

In Silverlight, you use the Image element to display bitmaps just as you use the TextBlock element to display text. Set the Source property of Image to the folder and filename of the bitmap within the project:

Example 1. Silverlight Project: SilverlightLocalBitmap File: MainPage.xaml (excerpt)
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Image Source="Images/Hello.png" />
</Grid>

The display looks a little different than the XNA program, and it’s not just the titles. By default, the Image element expands or contracts the bitmap as much as possible to fill its container (the content grid) while retaining the correct aspect ratio. This is most noticeable if you set the SupportedOrientations attribute of the PhoneApplicationPage start tag to PortraitOrLandscape and turn the phone sideways:



If you want to display the bitmap in its native pixel size, you can set the Stretch property of Image to None:

<Image Source="Images/Hello.png"
Stretch="None" />

Other -----------------
- Windows Phone 7: XNA Texture Drawing
- Windows Phone 7: An Introduction to Touch - Routed Events
- Windows Phone 7 : Working with Attachments
- Programming Windows Phone 7: An Introduction to Touch - The Manipulation Events
- Programming Windows Phone 7: An Introduction to Touch - Low-Level Touch Events in Silverlight
- Windows Phone 7: Composing a New Message
- Programming Windows Phone 7: An Introduction to Touch - The XNA Gesture Interface
- Programming Windows Phone 7: An Introduction to Touch - Low-Level Touch Handling in XNA
- Windows Phone 7: Responding to a Message
- Windows Phone 7: Checking for New Messages
- Windows Phone 7: Sorting and Searching Your Mail
- Windows Phone 7: Customizing Your Contacts List
- Windows Phone 7: Working with the Me Card
- Windows Phone 7: Posting to Facebook or Windows Live
- Programming Windows Phone 7 : Simple Clocks (part 2)
- Programming Windows Phone 7 : Simple Clocks (part 1)
- Windows Phone7: Pinning a Contact to Start
- Windows Phone7: Adding a Picture or Ringtone to a Contact
- Windows Phone7: Deleting a Contact
- Programming Windows Phone 7: XNA Orientation
 
 
Most View
- Windows7: Managing Network Connections (part 5) - Using a Network Connection to Wake Up a Sleeping Computer
- Sharepoint 2010 : Content Management - Importing a Term Set
- Keeping Windows 7 and Other Software Up to Date : Updating Drivers
- SQL Server 2008 : Managing Security - Security and SQL Agent
- Windows 7 : Turning Off Your Windows 7 Computer from Anywhere
- SAP Hardware, OS, and Database Sizing
- Windows 7 : Working with Users and Groups from the Command Line
- SharePoint 2010 : Search Options in SharePoint Server
- Programming Windows Phone 7 : Simple Clocks (part 2)
- Windows 7 Customization : Stopping Delete Confirmations
Top 10
- Implementing Edge Services for an Exchange Server 2007 Environment : Utilizing the Basic Sender and Recipient Connection Filters (part 3) - Configuring Recipient Filtering
- Implementing Edge Services for an Exchange Server 2007 Environment : Utilizing the Basic Sender and Recipient Connection Filters (part 2)
- Implementing Edge Services for an Exchange Server 2007 Environment : Utilizing the Basic Sender and Recipient Connection Filters (part 1)
- Implementing Edge Services for an Exchange Server 2007 Environment : Installing and Configuring the Edge Transport Server Components
- What's New in SharePoint 2013 (part 7) - BCS
- What's New in SharePoint 2013 (part 6) - SEARCH
- What's New in SharePoint 2013 (part 6) - WEB CONTENT MANAGEMENT
- What's New in SharePoint 2013 (part 5) - ENTERPRISE CONTENT MANAGEMENT
- What's New in SharePoint 2013 (part 4) - WORKFLOWS
- What's New in SharePoint 2013 (part 3) - REMOTE EVENTS