Where is the opacity set for a line?

[Chakie]

I need to create a small accessory icon for a mobile app, basically just a small downwards V indicator for "here be a menu". I open up a previous similar SVG icon to check the colors etc and I don't understand where the opacity is set. The SVG file has opacity set as 0.29, but it's not showing up anywhere. But clearly Designer uses the opacity from the SVG file somehow as otherwise it would be solid black. The only thing I could find in the help was for setting opacity by pressing the 0-9 keys, but that only makes it lighter with 0 keeping the color as-is. Tapping 0-9 also does not seem to change any value in the UI anywhere that I can see. There's a visual change, but no property seems to change anywhere.

My SVG file:

<?xml version="1.0" encoding="UTF-8"?>
<svg width="57px" height="119px" viewBox="0 0 57 119" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <title>settings_accessory_android</title>
    <g id="Settings" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.298787914" stroke-linecap="round" stroke-linejoin="round">
        <polyline id="settings_accessory_android" stroke="#000000" stroke-width="8" points="4.54150391 114.619718 52.5415039 58 4.54150391 4"></polyline>
    </g>
</svg>

I had a similar issue the other day when I was making a pattern for a wallet where I was just creating simple stroked rectangles and suddenly one rectangle was lighter than the others. It seemed to have gotten some opacity from somewhere. compared all properties I could find with another normal rectangle and found no differences. Clearly there's some color related setting here that I'm missing that also is set when I loaded the above SVG icon.

 

[Aammppaa]

The opacity here is set for the layer, so check the Layers Panel.

As you said, the colour is Black, the opacity is applied to the object.

 

[GarryP]

The Opacity for a Stroke, or Fill, can be set via the Colour Panel (and other similar places).

In your SVG, the Opacity is set (to 30%) on the parent layer (group) of the curve layer, not the curve layer itself.

To fix this, in an Affinity application, select the group and give it an Opacity of 100%, then select the child layer and set the Opacity via the Colour Panel.

Note: Pressing the 0-9 keys will set the Opacity for the whole layer, as can be seen in the Layers Panel.

[Chakie]

The layer seems to have 100% opacity. Pressing 0-9 changes this value from 0-100%. Somewhere I should be able to find a value that is 0.29 or 29%, but I haven't found it yet.

[GarryP]

That is a different design to the one you gave us earlier.

Can you stick to one problem with one design please?

The ‘fix’ for your original problem can be found in my earlier post.

Note: The Opacity value in the UI is rounded to the nearest(?) integer, so you should never see 10.5, 29.012, 54.32, etc.

[Chakie]

Or has Designer done some conversion on the color when opening the SVG? If I look at the top left properties these are totally different than the stroke color. A color #EBEBEB could well be what #000000 looks like with 29% opacity? But this is not how it should be done, Designer shouldn't go inventing own colors.

[Chakie]

Yeah, if I there change the color back to #000000 and then apply 29% opacity I get the same result. Seems to be a bug in the SVG loading.

 

[GarryP]

With limited screen-grabs and no actual document to work with, or a problem which changes without warning, we are hampered in our efforts in being able to help you.

If you stick to one problem at a time, and give us the relevant resources to help with that problem, then we can help you better.
If you keep ‘moving the goalposts’ then you’re going to have more trouble getting help.

[Chakie]

1 minute ago, GarryP said:

With limited screen-grabs and no actual document to work with, or a problem which changes without warning, we are hampered in our efforts in being able to help you.

If you stick to one problem at a time, and give us the relevant resources to help with that problem, then we can help you better.
If you keep ‘moving the goalposts’ then you’re going to have more trouble getting help.

No need to be so aggressive just because I used the wrong file. The second one was just a copy of the first file but with the three points moved to alter the direction. Attached is the original SVG that I was starting with. I can't seem to find where the opacity set.

settings_accessory.svg

[Chakie]

If I open the same file in Pixelmator it shows the opacity being rounded up to 30%.

[GarryP]

There’s a difference between aggressive and assertive.
I was attempting to be assertive because you seemed to be ignoring what you were being told.

I told you where the Opacity was set in that document, and how to fix it, and that the Opacity value is being rounded, in earlier posts.

[joe_l]

[Aammppaa]

How are you getting the SVG into your document?

If you are using the Place tool or drag & drop, then the SVG will become an embedded document, and you will need to drill down into it to access the actual contents. The Layers panel will tell you the object type. Double click to open an embedded object.

Pixelmator is showing the same as Affinity... a group with ~30% opacity, and a black stroke.

[Chakie]

4 minutes ago, GarryP said:

There’s a difference between aggressive and assertive.
I was attempting to be assertive because you seemed to be ignoring what you were being told.

I told you where the Opacity was set in that document, and how to fix it, and that the Opacity value is being rounded, in earlier posts.

No, I was not ignoring your posts. I was adding my own discoveries while your post was added and of course did not see it until I had posted mine. The content does not refresh unless you reload.

To get back to the solution. My original screenshot of the layers did not show any grouping, it only showed the curve itself with 100% opacity. But now it suddenly shows the correct hierarchy with the same ID as in the SVG file. I've switched back and forth between various apps and have no idea what I could have done to get it to expand the hierarchy. There was no down arrow to expand the group initially when I posted my question. I'm not too familiar with Designer but I do know to expand stuff and "look inside" when I search for something.

[Chakie]

18 minutes ago, Aammppaa said:

How are you getting the SVG into your document?

If you are using the Place tool or drag & drop, then the SVG will become an embedded document, and you will need to drill down into it to access the actual contents. The Layers panel will tell you the object type. Double click to open an embedded object.

Pixelmator is showing the same as Affinity... a group with ~30% opacity, and a black stroke.

I was using File -> Open to open the original file. Initially it did not show any drill down controls (the little expand V) and the single layer was named "Curve".

[v_kyr]

5 minutes ago, Chakie said:

I was using File -> Open to open the original file. Initially it did not show any drill down controls (the little expand V) and the single layer was named "Curve".

Best way to open SVG files. - When taking a look at your initial posting’s shown SVG code it’s obvious that the transparency setting is part of the SVG <g> group element and thus it will be setup in an appropriate ADe layer group named “Settings” with ~30% opacity and an included polyline  layer …