Silverlight

Expression Blend 3 Preview ile Import İşlemleri

Expression 3 Preview ile photoshop ve illustrator dosyalarından dosya importunun nasıl yapıldığına bakacağız.

23 Mart 2009 2 dk okuma 2055 1

Expression 3 Preview ile photoshop ve illustrator dosyalarından dosya importunun nasıl yapıldığına bakacağız.

Silverligt 3 betanın çıkmasyıla birlikte Expression Blend de yenilendi ve Expression Blend 3 Preview sürümü ile karşımıza çıktı. Expression Blend'in yeni sürümünde bir çok yeni özellik bizi bekliyor. Bunlardan biri de Photoshop ve Illustrator dosyalarını Expression Blend'e aktarılabilmesidir. Yani photoshop da hazırladığınız bir PSD dosyayı kaydettikten sonra tüm katmanlarıyla birlikte Expression Blend'e import edebiliyoruz.

Bu işlemin nasıl yapıldığına bakacak olursak; İlk olarak Photoshop'u açalım ve katmanlar oluşturarak kaydedelim.

Şimdi Expression Blend 3 ile yeni bir proje oluşturalım ve File menüsünden Import Adobe Photoshop'a tıklayalım.

Photoshop dosyasında (psd) oluşturduğumuz katmanlar karşımıza geldi. Buradan hangi katmanları import etmek istiyorsak seçiyoruz. "Preserve pixel dimensions on import" seçeneğini seçersek katmanların boyutları korunur. Eğer istersek "Merge Layer" ile Katmanları birleştirebiliyoruz.

Photoshopda oluşturduğumuz bir dosyayı katmanlarıyla birlikte Expression Blend'e aldık

Oluşan XAML koduna bakalım,

[XAML]

<UserControlxmlns:dc="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.DataForm" x:Class="SilverlightHtmlRender.MainPage"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   Width="350"Height="180"xmlns:template="clr- namespace:SilverlightHtmlRender">

    <Gridx:Name="LayoutRoot"Background="White">
        <Canvasx:Name="photoshop"Height="180"Width="350"Clip="M0,0L350,0 350,180 0,180z">
            <Imagex:Name="Layer_1"Height="200"Width="350"Canvas.Left="0"Canvas.Top="-10"Source="photoshop_Images/Layer 1.png"/>
            <Imagex:Name="Layer_2"Height="166"Width="150"Canvas.Left="6"Canvas.Top="6"Source="photoshop_Images/Layer 2.png"/>
            <TextBlockx:Name="SILVERLIGHt_Beta_3_IMport_PHOT"Width="152"Canvas.Left="168"Canvas.Top="17"FontFamily="Tahoma"FontSize="14"FontWeight="Bold"Foreground="#FFFF0101"Text="SILVERLIGHT BETA 3
IMPORT PHOTOSHOP"TextAlignment="Left"TextWrapping="Wrap"/>
            <Imagex:Name="Layer_3"Height="86"Width="153"Canvas.Left="170"Canvas.Top="64"Source="photoshop_Images/Layer 3.png"/>
        </Canvas>
    </Grid>

</UserControl>

Bu makalenin de sonuna geldik başka bir makale de görüşmek üzere. Silverlight ile kalın ;)

Sem GÖKSU
www.semgoksu.com | www.yazilimgunlugu.com
sem.goksu@yazilimgunlugu.com

Kaynaklar
msdn.com
silverlight.net

Etiketler: #Silverlight 3 Beta #Expression Blend

Paylaş: