C#/WPF: Display Images like a LightBox in jQuery?
Did anyone ever try to create a jQuery "LightBox"-Like "Popup" (WPF UserControl) for displaying Images? See this page for an example: http://www.huddletogether.com/projects/lightbox2/
开发者_如何学GoThanks!
Here is a site that appears to have done it, but it is only version 0.5 and might change dramatically before 1.0:
http://leandrovieira.com/projects/jquery/lightbox/#
This should be what you're looking for, and here is a sample of their code to implement:
$(function() {
$('#gallery a').lightBox({fixedNavigation:true});
});
I hope this helps,
Thanks!
EDIT:
Sorry that I didn't fully understand what you ment in version one of your question. Here is an updated answer (with code / source) to your question.
First I created a control that will act as a modal dialog box that grays everything out in the background. Then I added the ability to put a picture in there, with added ability to have a comment with each picture. Here are images of the final product:
First Image Loaded: First Image Loaded http://img682.imageshack.us/img682/8941/firstpictureopen.jpg
Second Image Fading In: Second Image Fading In http://img5.imageshack.us/img5/3172/secondpicturefading.jpg
Second Image Loaded: Second Image Loaded http://img682.imageshack.us/img682/5404/secondpictureopen.jpg
I also added animations to resize the images like the Lightbox project does. I added the ability to have a forward and back buttons, accelerator keys, forward and back arrow control, and escape to exit. I think I've captured what you're looking for in this control.
As usual, I've uploaded the full source code to Google Code for your download.
The direct link to the zip file is here:
http://stackoverflow-answers-by-scott.googlecode.com/files/1755872.zip
I hope this helps,
Thanks!
Duplicating the functionality you linked to is absolutely trivial in WPF. Just:
- Create a
UserControl
with a singleItemList
property of typeIEnumerable<ImageSource>
- Add a
Popup
to theUserControl
- Add a
Grid
to thePopup
that lays out the LightBox the way you want, including panels for theImage
,TextBlock
, andButton
- Add a
StoryBoard
that is triggered by theLoaded
event that animates the changes. - Use an
EventTrigger
to set thePopup
'sIsOpen
property to false when the button is clicked - Bind the
Image.Source
to{Binding ItemList/}
to show the current item in the ItemList - Add a
Background="Transparent"
rectangle to each side of theGrid
that runs code-behind to change the current item inItemList
- Optionally also repeat the
BeginStoryboard
when changing the current item
精彩评论