How to format customized SF-Symbols SVG files for import into Xcode11 - xcode11

Has anyone figured out how to create customized SF-Symbols using the techniques outlined in the WWDC video, the only existing documentation that I can find on the subject? According to the video one can simply edit the exported SVG file and reimport it as a symbol set.
And while this does work for minor edits, I'm finding it very difficult to produce a working customized symbol file with more than a minor edit. The errors and/or bugs produced are numerous and I've tried many things to produce an acceptable file (removing strokes, converting to shapes, etc). Most imported files produce an error similar to:
The SVG file provided for the symbol image set ’doc.test3‘ is not
suitable: Symbol image file '(null)' has glyph node Regular-M that is
not a group got type:'2' expected:'1'"
Does anyone have any suggestions? I don't have a specific project goal here. I'm simply trying to learn the appropriate way to create a custom symbol in the absence of any documentation.

The overview documentation suggests that one take an existing symbol file and open it in Sketch or some other SVG editor. Specifically the documentation on creating a new symbol gives a bit of a walkthrough. I believe the workflow will be something like this...
Export any symbol from the SF Symbols app 1.0 (12) to an svg file
Grab an SVG file of your favorite image that you want to make a new
symbol
Using an editor (eg. Sketch) drag the exported SF Symbol file onto an empty page (it'll show multiple images)
Make a second page in Sketch and drag in your new image
Using the layers in Sketch you will see that the SF Symbol has the
shape defined within a layer with a name called Shape
For each Shape layer substitute (copy/paste) a comparable shape/path from the set of shapes/paths on a layer from your new image
Adjust the linewidth and positioning to match the corresponding
shape contents within the SF Symbol
Remove the SF Symbol for the specified weight
When Finished modifying all shape/paths for the Symbol -> Export/Save the updated Symbol page as an SVG from Sketch.
You should then be able to add the svg file to the Assets container
as a new symbol image set
Note - As part of my test, I noted that although the header of the SVG
was different when I exported the symbol file from Sketch when I added
the file to Xcode (drag/drop), the new symbols did appear.
Also, the font used in the edited File defaulted to Helvetica instead
of the new SF font in the original exported SF Symbol file.

Go back into the SF Symbols app after creating the SVG. Click on File - Prepare Custom Symbol for XCode.... Select your SVG and let the SF Symbols app do its magic.
The function is still rather buggy though. Sometimes the SVG gets altered. You also cannot overwrite an existing SVG when choosing the destination to save the modified file created by the SF Symbols app.

Related

How to preserve vertical text in 'Fixed-Format' ePubs?

I'm exporting a textbook as a Fixed-Format ePub via InDesign 2020 but noticed vertical text get exported horizontally instead! Here is an example of what I mean:
Here's how it should look like:
Does anyone know how I can preserve the text rotation? There are hundreds of examples of this issue in the book. Would there be a 'global' setting/CSS to resolve this?
Do you have control over the Indesign table styles?
See: https://helpx.adobe.com/in/indesign/using/table-cell-styles.html
If the table regions are styled correctly, you should be able to get the styles exported in the CSS. I haven't worked in the latest Indesign, and EPUB table exports have been patchy in the past. However, if you have custom table styles applied, you can edit the CSS to make it match the source as close as possible.

Replacing fonts in Powerpoint view does not replace font

I have a PowerPoint template. When this template was passed off It included some special fonts that I needed to remove because it was throwing warnings when users opened them up.
When I use the "replace fonts" feature it does not remove the font. I deal a lot with the XML properties of these templates because some of the content is generated dynamically when a report is run. I can still see in the slides the font is present
<a:buFont typeface="Poppins"/> the other is <a:buFont typeface="Noto Sans Symbols"/>
Which both appear to be bullet list fonts? There are no lists in the view though...
Removing it from the XML itself is not an option because when I update the template again it will override that and given that doesn't happen often I will have forgotten all about this. I need to fix this in the template so I can then export it out.
I have edited all the text I can see to either Ariel or Calibri but this Poppins font is still in there and I have no idea how to get it out.
Specifics are
Powerpoint version is 16.36
The program is actually Powerpoint for Mac (if that matters)
If anyone solved a similar issue and can give me some direction it would be much appreciated.
The buFont tag means that font is being used for a bullet rather than actual text. Probably a text level somewhere uses a custom bullet specced with this font. Each content or text placeholder can have up to 9 text levels, you may hove to create 9 levels using Home>Indent More to find the right one.
Start with the Slide Master (View>Slide Master>the larger thumbnail at the top). Then check each placeholder on each Layout (smaller thumbnails below the Master). Finally, check each multilevel placeholder on each slide, in case this was added with local formatting.
My go-to technique is to unzip the presentation into the XML files and do a find and replace on them. That's the quickest way to replace fonts, which can be tucked away in all kinds of obscure places in a presentation. On a Mac, this takes a bit of preparation to avoid problems caused by the OS. If you regularly create PowerPoint files, it may be worth it to set this up. Here's my article on this: OOXML Hacking: Editing in macOS. Look for the part about using a USB or network drive that is set to not create hidden .DS_Store files. Then use a text editor like BBEdit to do multi-file find and replace operations on the font name.
I have PowerPoint 16.39 on my MacBook Pro. Try to click on PowerPoint in the upper left. Then Preferences, then the Save icon. At the bottom you'll have Font Embedding. If you un-check this option, it should not save fonts to the template anymore.

Xcode custom symbol image set asset

From Apples documentation I read:
An alternative to creating bitmap images is to use template images or symbol images instead. Template images specify the shape you want to draw, but not the associated color information. Symbol images are similar to template images but are vector based, so they scale to different sizes. Both types of images simplify the process for supporting Dark Mode. They also reduce the number of image assets you must ship with your app.
Do I understand this correct that I can not use a vector based symbol image set as a replacement for bitmap but scalable?
Update
My situation:
I've an Image Set in my iOS project. There I can add three bitmaps for the three scaling options iOS devices support. Those images must be of type *.png
Now I would like to replace those three bitmaps with a single vector graphic file *.svg. This seems not possible. If I want to use vector graphic images I've to add another asset type called "symbol image set" (Xcode -> Editor -> Add Assets -> New Symbol Image Set).
So far so good but now my question. Those "symbol image set" assets only the the shape but not the color information into account. That's why I would like the "old" way where the color information is taken into account but the file being a vector graphics file (*.svg).
You don't actually need a Symbol Set for what you are trying to achieve.
All you need is a vector image in pdf format, marking it as Single Scale
Then, you can mark the asset as template (meaning you can tint it with any color) or original if you want to retain its original colors.
Finally, note that although you supply vector images, Xcode by default will produce png versions for all scales behind the scenes. If you need to preserve the vector data (which can help in some cases where you need to upscale) you can enable Preserve Vector Data as well.

What is the format "BM6"?

I am working with an old system of palletes. When I export an image, it also creates an pallete with 15/16 colors. But when I try to replicate the same result, the program does not recognize the image which I just created. To analyse what happened, I opened some images with notepad and compared them with my "creation" and I noticed quite some differences.
But the most interesting thing was that at the beginning of my images' code was the type "BM6", while they should be "png" or "bmp". I think that is some thing of codification, but I cannot find anything about it.
If the image file is properly formed, then you can take your .bm6 file and simple change / rename the extension to .bmp. And it should suddenly be an image.
.bm6 can result from creating an image file using a text editor, as seen here.

Photoshop - is there a way to link images accross multiple psd files?

With Photoshop I have multiple web banners at different sizes that contain the same image. Is there a way to change the image on one psd file so that it will automatically change on all the other psd files?
I'm using Creative Cloud
Any help will be really appreciated
Thanks
Create the banner in the biggest size
Right click the layer and choose Convert to smart object
Create a new document with next banner measurements. Go back to the already created banner and use the move tool (v) and drag the layer/layers in to the new document.
If you now doubleclick your smart object (doesnt matter in which document) you will open a new document. If you make any changes there it will be changed in both banners.
You can choose more than one layer to become a smart object together. When you double click the smart object you will find all your layers separate but in the banner document it will only show as one file.
This is what the symbol on a smart layer looks like
One option is to use linked smart objects.
If you have photoshop CC you can follow this for instruction on how you'd do it.
(Sorry for the link only answer but it's a video and will make more sense then listing the steps)
if you use Photoshop CC 2014 or 2015 you can place images as linked files, same way as InDesign or HTML docs. Adobe gives now two choices Place Embeded or Place Linked.

Resources