How to create a PathIcon application panel button from an svg image with multiple paths?

Create the application window application application application 8.1 in the view.

I am trying to create a toolbar button image from these svg image paths.

 <AppBarButton  AutomationProperties.Name="Label" RequestedTheme="Default"  Label="print Label"  Command="{Binding ButtonCommand}" CommandParameter="print label">
         <AppBarButton.Icon>
              <PathIcon Data="M13.5,14.25v-5h13v5h-2v-2.5h13v2.5H13.5z"/>
         </AppBarButton.Icon>
 </AppBarButton>

Below svg imageinText format

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
<g>
<g>
    <path fill="#FFFFFF" d="M26.508,14.365h-0.12l-13.14-0.021c-0.581,0-1.051-0.476-1.049-1.056c0-0.58,0.469-1.052,1.05-1.052
        l13.141,0.008c0.582,0,1.053,0.482,1.053,1.062c-0.002,0.578-0.473,1.06-1.053,1.06"/>
    <path fill="#FFFFFF" d="M21.198,11.71h0.066l-2.89-0.108c-0.389-0.002-0.702-0.364-0.7-0.752s0.274-0.72,0.702-0.724l2.891-0.005
        c0.389,0.004,0.701,0.41,0.699,0.799c-0.001,0.385-0.312,0.79-0.699,0.79"/>
    <g>
        <g>
            <path fill="#FFFFFF" d="M26.39,15.34h-13.03l0.083,1.465c0,0.042-0.009,0.08-0.007,0.122l0.569,11.524
                c0.043,0.871,0.793,1.587,1.67,1.587h8.399c0.875,0,1.624-0.716,1.67-1.587l0.568-11.524c0.002-0.042-0.005-0.08-0.007-0.122
                L26.39,15.34z M16.398,28.466c0,0-0.017,0.001-0.024,0.001c-0.383,0-0.699-0.301-0.713-0.686l-0.371-9.987
                c-0.016-0.391,0.292-0.724,0.685-0.738c0.381-0.005,0.725,0.294,0.74,0.688l0.372,9.982
                C17.101,28.12,16.795,28.451,16.398,28.466z M20.513,27.754c0,0.39-0.312,0.701-0.699,0.701
                c-0.389-0.001-0.701-0.313-0.701-0.701l0.014-9.985c0-0.387,0.312-0.7,0.7-0.7h0.002c0.385,0.001,0.7,0.314,0.7,0.7
                L20.513,27.754z M23.968,27.782c-0.015,0.384-0.328,0.685-0.712,0.685c-0.009,0-0.016-0.001-0.028-0.001
                c-0.392-0.015-0.7-0.349-0.685-0.74l0.396-9.981c0.015-0.395,0.34-0.703,0.74-0.688c0.391,0.017,0.7,0.349,0.684,0.74
                L23.968,27.782z"/>
        </g>
    </g>
 </g>
 </g>
</svg>

I created a PathIcon Image if there is one in the svg image only one path data.
But how to handle the case described above when they used more than one pathto create it.
If any idea please ..!

+4
source share

Source: https://habr.com/ru/post/1526333/


All Articles