Mi sono dato alla creazione di un altro plugin per Windows Live Writer. Mi capita spesso di creare post il cui scopo è avere solo link a n immagini che vado preventivamente ad uploadare sul mio sito www.igordamiani.it. Per esempio, date un'occhiata al post relativo all'ultimo workshop.
Quali sono le caratteristiche che saltano all'occhio?
E' presto detto...
- C'è un breve commento all'inizio
- C'è un'immagine o una fotografia visibile direttamente nel post
- Ci sono una serie di n link, che puntano direttamente a n immagini JPG uploadate sul sito
Come dicevo, mi capita spesso di scrivere post di questo tipo e anche se non sembra, è piuttosto noioso farli, perchè sono sempre operazioni ripetitive. Scegli le immagini giuste, ridimensionale, uploadale sul sito, scrivi il post inserendo a mano una descrizione ed il link corretto e via dicendo. Ho deciso quindi di scrivere un plugin per WLW per automizzare il più possibile questa cosa, così vi posso bombardare più spesso di fotografie. :-) Perchè non farlo in WPF per renderlo più accattivante? Arrivo al dunque, altrimenti qua non finisco più.
La caratteristica fondamentale: la scelta delle fotografie
Il plugin, già in fase di sviluppo, permette all'utente di puntare una directory sul proprio hard-disk e poter scegliere le immagini da pubblicare oppure no. Do per scontato che le immagini nella directory siano già ridimensionate al punto giusto, perchè non faccio fare al mio plugin cose che altri software fanno già bene (come per esempio IrfanView). Dopo aver indicato la directory, si clicca su un pulsante che fa quanto segue:
void btnRefreshLocalPath(object sender, RoutedEventArgs args)
{
DirectoryInfo di = new DirectoryInfo(txtLocalPath.Text);
FileInfo[] files = di.GetFiles("*.jpg");
lstImages.Items.Clear();
foreach (FileInfo f in files)
{
ImageElement ie = new ImageElement(f.FullName);
lstImages.Items.Add(ie);
}
}
Il path viene recuperato dalla TextBox, viene utilizzato il metodo GetFiles() per ottenere la lista di tutti i files JPG (to be changed?) nella directory. In seguito, la ListBox viene svuotata e viene creato un oggetto ImageElement per ogni file esistente. La classe ImageElement incapsula tutta la logica che serve per gestire le immagini. Ogni istanza di ImageElement infatti permette di:
- selezionare/deselezionare l'immagine (usando una CheckBox)
- vedere l'immagine e decidere se la si vuole o no (usando un'Image)
- inserire una breve descrizione relativa all'immagine (usando una TextBox)
La classe ImageElement è uno UserControl scritto per WPF, quindi un po' XAML ed un po' C#. La parte XAML è forse la più interessante:
<UserControl x:Class="VivendoByte.PostSomeImages.ImageElement"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<UserControl.Resources>
<Style x:Key="normal" TargetType="{x:Type TextBox}">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=chkSelected, Path=IsChecked}" Value="True">
<Setter Property="IsEnabled" Value="True" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=chkSelected, Path=IsChecked}" Value="False">
<Setter Property="IsEnabled" Value="False" />
</DataTrigger>
</Style.Triggers>
</Style>
</UserControl.Resources>
<StackPanel Orientation="Vertical" Name="panel">
<CheckBox Content="Select this image" IsChecked="False" Margin="0 6 6 1" Name="chkSelected" />
<Image Name="imgImage" Stretch="UniformToFill" Width="180">
<Image.Source>
<BitmapImage UriSource="{StaticResource image}" />
</Image.Source>
</Image>
<TextBox Name="txtDescription" Margin="0 3 6 1" Style="{StaticResource normal}" />
<Label Height="3" Background="SkyBlue" />
</StackPanel>
</UserControl>
Il visual-tree di ogni istanza di ImageElement contiene uno StackPanel verticale, che contiene a sua volta una CheckBox, una Image, una TextBox ed infine una Label (che funge semplicemente da separatore - to be changed). Ho inserito due triggers per rendere più divertente la cosa: quando una certa immagine non è selezionata (proprietà IsChecked della CheckBox = False), allora non ha senso che l'utente ne inserisca la descrizione, quindi setto la proprietà IsEnabled della TextBox a False. Teoricamente, avrei potuto inserire un solo trigger, con qualche giro di binding, ma sono andato in fumo e...proprio non ce la faccio: va bene così! :-)
Un piccolo screenshot è come al solito doveroso.
Adesso è piuttosto spartano, ma l'idea è questa. Le foto selezionate vengono uploadate sul sito indicato, usando username e password specificate, poi ne viene presa la descrizione, viene fatto il link ed il tutto viene restituito a WLW. Appena è pronto lo pubblico, credo che possa interessare un po' di gente. Stay tuned.