StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow do I create a custom pushpin with image, label, and click event?
primarykey
Id
9476520
data
AcceptedAnswerId
9476669
AnswerCount
1
ClosedDate
CommentCount
0
CommunityOwnedDate
CreationDate
2012-02-28T04:42:42.083
FavoriteCount
0
LastActivityDate
2012-02-29T01:45:09.797
LastEditDate
LastEditorUserId
0
OwnerUserId
877129
ParentId
0
PostTypeId
1
Score
0
ViewCount
1257
LastEditorDisplayName
text
Body
<p>I am working on a location aware app, where I want to have custom pushpins that have an image, and when you tap the image, a label is added. I have tried a couple of solutions... </p> <p>I started with this code, from this article: <a href="http://igrali.wordpress.com/2011/12/06/making-a-custom-windows-phone-bing-pushpin-from-an-image/" rel="nofollow">http://igrali.wordpress.com/2011/12/06/making-a-custom-windows-phone-bing-pushpin-from-an-image/</a></p> <pre><code><ControlTemplate x:Key="PushpinMe" TargetType="maps:Pushpin"> <Grid Name="PushpinMeGrid" Height="50" Width="50" HorizontalAlignment="Center" VerticalAlignment="Center"> <Image x:Name="PushpinMeImage" Height="50" Width="50" Source="Pushpins/pushpinSeaplane.png" /> <TextBlock Text="{Binding Source=}" </Grid> </ControlTemplate> </code></pre> <p>Then I tried wrapping the image in a button, but that just made the pushpin essentially invisible. Then I tried using a control template from one of my prior apps, and modified it, and came up with this:</p> <p></p> <pre><code> <Button Name="PushpinButton" Click="Button_Click"> <Button.Style> <Style TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Image Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Height="50" Width="50" Source="Pushpins/pushpinSeaplane.png" /> <Grid Grid.Column="1"> <Grid.RowDefinitions> <RowDefinition Height="39" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid Grid.Row="0" Background="Black"> <TextBlock Grid.Row="0" Foreground="White" Text="{Binding ElementName=me, Path=Content}" TextWrapping="Wrap" Margin="5" /> </Grid> </Grid> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Button.Style> </Button> </ControlTemplate> </code></pre> <p>Still not a winner - I can't bind the content of the button, and therefore the textblock.</p> <p>There will be a series of pushpins, with different images, and different labels, so ideally, I would like to come up with a template that I can use, and bind the image and the label from code. The code for the button's click event would be as simple as making the textblock visible or collapsed.</p> <p>I know my second example is pretty ugly, but I was trying to make the visual look right - I'll modify it as needed for the visuals, but for the moment, I need to figure out how I can bind the image and the text from code. The button click event works with just a messagebox for now (to show that it registered the click event).</p> <p>Thanks for your assistance.</p>
Tags
<silverlight><windows-phone-7><windows-phone>
Title
How do I create a custom pushpin with image, label, and click event?
singulars
PostAcceptedAnswerId
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. This table or related slice is empty.
UserOwnerUserId
1. USRich Hopkins
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
VotesPostIdCreationDate
1. This table or related slice is empty.
CommentsPostId
1. This table or related slice is empty.

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.