2014-02-15 2 views
1

В моем приложении Windows Phone 8 я использую набор значков. Эти значки используются несколько раз с разным размером и цветом. Прямо сейчас у меня просто несколько файлов png из одного и того же значка, чтобы охватить все эти варианты.Как изменить растровые изображения на векторный путь

Как он может обрабатывать векторные изображения? Моя конечная цель - хранить векторный путь, например. файл ресурсов и использовать его как «источник изображения», установите размер и цвет изображения в моем представлении, а не в файле ресурсов.

Допустим, у меня есть Canvar вроде этого:

<Canvas Width="76" Height="76" Clip="F1 M 0,0L 76,0L 76,76L 0,76L 0,0"> 
    <Path Width="23.75" Height="49.4791" Canvas.Left="26.9167" Canvas.Top="13.8542" Stretch="Fill" Fill="#FF000000" Data="F1 M 26.9167,13.8542L 50.6666,13.8542L 50.6667,39.5833L 26.9167,63.3333L 26.9167,13.8542 Z "/> 
</Canvas> 

Как я могу хранить это ресурс и использовать его в качестве источника изображения?

Все предложения и идеи приветствуются, как справиться с этим.

UPDATE

на основе Chris W ответ, я пришел к этому решению:

<Style x:Key="Marker" TargetType="ContentControl"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="ContentControl"> 
       <Canvas Width="76" Height="76"> 
        <Path Fill="{TemplateBinding Foreground}" Data="m 26.9167 13.8542 23.7499 0 10e-5 25.7291 -23.75 23.75 0 -49.4791 z"></Path> 
       </Canvas> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 


<ContentControl Style="{StaticResource Marker}" Foreground="Red" /> 

Это работает нормально, я могу повторно использовать стиль Mrker и установить его цвет заливки. Недостатком этого является то, как изменить размер холста/contetnControl?

Теперь размер холста 76 * 76, даже если я изменю, что выходное изображение все равно того же размера. Как изменить размер холста?

+0

Я не думаю, что WPF/Silverlight поддерживает SVG (см. Http://stackoverflow.com/questions/15191536/using-svg-files-like-png-files-in-windows-phone и http: // stackoverflow .com/вопросы/12092522/обработка-SVG-в-Windows-телефон-приложение). SVG - это общий формат векторного файла. Но вы можете конвертировать и SVG в XAML –

+0

Thats именно то, что я пытаюсь сделать, конвертировать векторное изображение в xaml (canvas) и использовать его. Но что лучше всего подходит для этого. Как я могу назначить холст, определенный в ресурсе, фактическому элементу ui (image?). – devha

ответ

2

Первая часть вашего вопроса будет duplicate, и я думаю, что Illustrator или другие наборы могут сделать то же самое, но чтобы ответить на ваш второй вопрос, вы можете просто внести его в шаблон ContentControl;

<Style x:Key="ReUsableResource" TargetType="ContentControl"> 
     <Setter Property="Height" Value="49.4791"/> 
     <Setter Property="Width" Value="23.75"/> 
     <Setter Property="Template">  
      <Setter.Value> 
      <ControlTemplate TargetType="ContentControl"> 
       <Canvas> 
         <Path Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Stretch="Fill" Fill="#FF000000" Data="F1 M 26.9167,13.8542L 50.6666,13.8542L 50.6667,39.5833L 26.9167,63.3333L 26.9167,13.8542 Z "/> 
       </Canvas> 
      </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Затем вызовите его как;

<ContentControl Width="100" Height="50" Style="{StaticResource ReUsableResource}"/> 

Ох, и просто прочитать комментарии, чтобы получить его из вектора в XAML другой очень удобный ресурс Mike Swanson's XAML exporter plugin for Illustrator.

Надеюсь, это поможет.

+0

Спасибо, что работает нормально, но как изменить размер холста? Уточните вопрос. – devha

+0

@devha см. Отредактированный ответ, просто разделите высоту/ширину с холста и примените его к тому, где вы вызываете contentcontrol. –

+0

Изменение размера ContentControl не изменяет размер холста (даже если я удаляю высоту/ширину с холста) :( – devha

Смежные вопросы