I am using the RichTextEditor from smartGWT and it comes with 7 different fonts by default, but I would like to support ONLY 1 font type, and not 7, but the font I want to support does not come with the RichTextEditor. How can I set the supported font types from the RichTextEditor?
It seems that they don't expose much of that functionality in the RichTextEditor API, however I believe it could be achieved by doing the following:
RichTextEditor rte = new RichTextEditor();
// remove the font controls
rte.setControlGroups("formatControls", "styleControls", "colorControls");
// set the base font for the editor, could also be done with a <span> tag
rte.setValue("<font face="Bookman Old Style, Book Antiqua, Garamond"></font>");
Related
I’m new with Ionic React and I’m looking for the correct way to integrate custom fonts and a custom icon set into my project, so that it’s working on all platforms as intended.
Custom Icon set
My goal is to make my custom icons work with IonIcon so that I can use the default styling options like “size” and the CSS variables (e…g --ioinc-stroke-weight).
What I did so far:
I added the icon set (all icons are svgs) into “public/assets/customicons/”
I imported IonIcon into my components where needed
Integrated the (e.g. )
So far the icons are displayed as intended and custom attributes “size” is working.
But, I’m not able to set the icon color or stroke-width programmatically. All the icons have set a default attributes (e.g. < g fill=“none” fill-rule=“evenodd” stroke="#092A5E" stroke-linecap=“round” stroke-linejoin=“round” stroke-width=“8” >). Even if I remove those default attributes, I’m not able to set them via CSS variables
Question 1: Is “public/assets/customicons/” the correct folder to store the icons?
Question 2: How can I make it work that I can change the color of the icon via CSS?
Custom Font
Goal: I want that the custom font is shown on all platforms
What I did so far:
Added the custom fonts in “src/assets/fonts/”
Created a “fonts.css” in “src/theme/” where I integrated the font via “#font-face”
#font-face {
font-family: ‘FONTNAME’;
src: url(’…/assets/fonts/FONTNAME.ttf’);
font-style: normal;
font-weight: 400;
font-display: swap;
}
assigned the font to differnet elements
Question 1: Is this the correct folder to store the custom fonts? (I wasn’t able to do the same when the custom font was saved under “public/assets/fonts/” like the icon set)
Unfortunately, I wasn’t able to find any docs, tutorials or posts on any of these topics.
Thanks for your help!
as you know the Mail app in iOS 5 have a rich text editor is there any possible way to use this feature for a regular UITextView ?
I know of two fundamental approaches to creating a rich text editor in iOS 5:
Use Core Text and a custom view. I don't have any experience with this approach.
Use a UIWebView (instead of a UITextView) and the contentEditable HTML attribute. The basic idea is to load a custom HTML document from your app resources directory. The bare minimum that it needs is this:
<div contentEditable>TEXT_PLACEHOLDER</div>
To initialize the rich text editor view:
1. Load the contents of this file into an NSMutableString and replace the TEXT_PLACEHOLDER string with the text you want to edit.
2. Send the loadHTMLString:baseURL: message to the UIWebView with that HTML string.
Now you have a UIWebView displaying your text inside a div with contentEditable. At this point, you should be able to run your app tap on the text, and be presented with a cursor and be able to add/remove text. The next step is to add rich text formatting functionality. This is done with a set of simple javascript function calls. See the Mozilla documentation on contentEditable for a great reference. You will also want to add a Javascript function to your HTML template file like this:
function getHtmlContent() { return document.getElementById('myDiv').innerHTML; }
So you can easily retrieve the edited text as HTML using [myWebView stringByEvaluatingJavaScriptFromString:#"getHtmlContent()"]. You can also add custom context menu items like you show in the screen shot in your question.
If you have access to the Apple iOS dev center, the WWDC session Rich Text Editing in Safari on iOS talks all about this approach.
A variation of this approach is to use a third-party rich text editor like TinyMCE. I've heard of some success with integrating this into a UIWebView in iOS 5. Again this relies on the contentEditable attribute.
Here is my implementation. Still haven't added UIMenuController functionality, but it's planned to be added soon.
https://github.com/aryaxt/iOS-Rich-Text-Editor
The iOS 5 rich text edit control is also present in the notes app in iOS 4 (make a rich text note on the computer and sync it to see).
This is a custom Apple-made control which they use in their own apps, but it is not published in any official developer API. It's probably in the SDK somewhere, but because it is undocumented, even if you find it and use it, Apple will reject your app.
Basically, if you want a rich text control you will have to make your own.
Edit: Try using this: https://github.com/omnigroup/OmniGroup/tree/master/Frameworks/OmniUI/iPad/Examples/TextEditor/. I haven't used it, so I don't know how well it will work. (Link from this question)
look at https://github.com/gfthr/FastTextView which is more good open source editor than Omni editor
I've looked at the following link:
Setting UILabel - Font through code - generates error - iPhone
Which provides code to see all the available iOS fonts. For HelveticaNeue we get the following:
HelveticaNeue-Italic
HelveticaNeue-Bold
HelveticaNeue-BoldItalic
HelveticaNeue
Why does Interface Builder provide a slew of other options for fonts though? I've plopped a UILabel down and I see options for HelveticaNeue-Medium and HelveticaNeue-Light for example and they seem to work fine when compiling ?
The reason I'm asking is that I'm now programmatically generating a UILabel and would like to set it's font to HelveticaNeue-Medium but it looks like that's not an option?!
The Interface Builder shows all fonts available on the Mac. Not all of them are available to iOS. Before using a font, make sure that is available on iOS.
While Interface Builder lets you pick any font, it defaults to Helvetica if the font isn't available. As far as I know, it also compiles down to Helvetica (or the system default, which apparently isn't Helvetica on iPhone 4).
Or, at least, custom fonts don't work in IB; I have to set them in -awakeFromNib or -viewDidLoad: (no, this is not a UIAppFonts problem).
I have two questions
Can this code be added to blogger?
Can this code embed unicode fonts? and if can, please tell me the link how to do it.
I can't see your code Kotaro ,
but any code can added to blogger and and by default embedding font in web is not available . but you can use CSS 3.0 to force user to use from the font you like, this css property is
font-url
and you can use it as any other css property like
<div style="direction:ltr;text-align:left;font-size:small;font-url:('../resources/fonts/YourFont.ttf');"> you code </div>
just note that this CSS property just available at css 3.0 and now just Firefox 3.5 supports it so I recommand you Ignore it for now,
if you want to show a speciall text just use from a font that you know your users have it, like (Arial , Tahoma , Verdana ) for windows usres
for code you can use these software
1- copysourceashtml
http://copysourceashtml.codeplex.com/
that is a opensource software
copysourceashtml http://i3.codeplex.com/Project/Download/FileDownload.aspx?ProjectName=copysourceashtml&DownloadId=78099
2- Postable
http://vahid.nasiri.googlepages.com/postable.rar
I am having the "Futura.ttf" font file.
I am displaying a HTML page in the UIWebView, but my requirement is that i want to use the custom font in my css file.
so is there any way that i can use the custom font in my css file ???
All suggestions are welcomed.
Thanks.
It is possible to load custom fonts into your UIWebView in iOS3.2 and above. Add the font to your bundle (see here) then just reference the font in your UIWebView's stylesheet like you would any other font:
<style type='text/css'>font { font-family: DroidSerif; } </style>
You have Cufon and sIFR as your options.
Typeface.js is a pure JavaScript Replacement
Cufon is a pure JavaScript Replacement
sIFR is Flash and Java font implementation,
FLIR JavaScript and PHP implementation
Some Comparisons
http://thatguynamedandy.com/blog/text-replacement-comparison
http://thinkclay.com/technology/cufon-sifr-flir
http://aaronwinborn.com/blogs/aaron/cufón-alternative-sifr-image-replacement
Below is taken from this question Worth reading the whole thread, has greatdetails.
Typeface.js
Advantages:
User doesn’t have to have Flash
plugin installed on their browser
Easier to create with just a few
lines of Javascript
For page loading it just needs to
load the Javascript
Disadvantages:
Text is not selectable because it
outputs it like an image. I looked at
some examples, right clicked on a
word and had to view as an image.
Every single word had this behaviour.
Big thumbs down.
Usage for body copy will slow down
loading time, so it is recommended to
use only for headlines.
Cannot be read by screen readers
Visual looks blurry
Not all browser compliant and still
has a lot of development left to be
done
sIFR
Advantages:
Can be read by screen readers as a
normal headline because it is a
behaviour layer on top of the markup
and styling.
Text is selectable
SEO friendly
Displays text as is like any other
web font. Crisp and not blurry!
Has addons like jQuery sIFR Plugin!
Disadvantages:
Requires Javascript to be enabled
Flash plugin must be installed in the
browser
Need Adobe Flash Studio to create it
BUT there is a pretty nifty sIFR
generator that creates the file for
you!
For page loading, it has to request
for Flash, Javascript and CSS files
attached to it, which can potentially
get bogged down if you are using sIFR
in too many places.
Cannot display on an iPhone. Yet…
Cufón (similar to Typeface.js)
Enter Cufón, the Javascript-based font replacement solution which makes heavy use of canvas and VML. This offers a great alternative to other solutions out there - no Flash or images required.
There are some issues with using Cufón on a live site, the most notable being the inability to highlight and copy/paste text, which is really the biggest issue for your site's users.
Combine that with the EULA issues, which prevent you from being able to legally embed fonts in Javascript files for most fonts on the market today.
The other issue is knowing what fonts can be used with Cufón. For sIFR, most fonts are fair game, since the font is embedded in a Flash movie, which is typically an approved usage by most font foundries for most fonts. With Cufón, the Javascript files used for the font can be easily "stolen" and either used on another website or reverse engineered.