Create template page for printing - ionic 2 - android

Ionic printer plugin use Printer.print([html string], [printer options]) function to get print out using mobile app.
I need to create html template and update some values dynamically and use template as input for the print function.
Can anyone have any idea how to do this?
I am using ionic 2 and android platform.

It depends on what exactly want to print.
I would probably just create an HTML template inside your code and then replace the values before printing.
Example:
class Page {
template: string = `<h1>{title}</h1>
<p>This is a paragraph</p>
<p>{content}</p>`;
getHTML(title, content) {
let str = template;
str = str.replace('{title}', title);
str = str.replace('{content}', content);
return str;
}
printPage(title, content) {
let options = {};
this.p.print(getHTML(title, content), options).then(onSuccess, onError);
}
}

Related

PDFTron iOS and Android how to open the PdfViewCtrl at a specific page?

We are using the PDFTron SDK to read PDFs in our Xamarin app.
What we want to do is open the PDF at a specific page, since we want our users to continue reading where they left on our website.
We are following the example found here, with the PTTabbedDocumentViewController on iOS. Here is what we tried, to make this work.
PDFDoc pdfDoc = TypeConvertHelper.ConvPdfDocToManaged(mTabViewController.SelectedViewController.PdfViewCtrl.GetDoc());
if (pdfDoc != null)
{
var pageCount = pdfDoc.GetPageCount();
}
But, the pdfDoc instance is always null. Please, can someone help?
Android
There is a method to start the viewer on a specific page:
https://www.pdftron.com/api/xamarinandroid/pdfnet/api/pdftronprivate.PDF.PDFViewCtrl.html#pdftronprivate_PDF_PDFViewCtrl_CurrentPage:
​
Here is a code sample:
var myPage = 3;
mPdfViewCtrl.DocumentLoad += (sender, e) =>
{
// On document loaded, set the page
mPdfViewCtrl.CurrentPage = myPage;
};
iOS:
For iOS the equivalent method is this:
https://www.pdftron.com/api/xamarinios/tools/api/pdftron.PDF.PTPDFViewCtrl.html#pdftron_PDF_PTPDFViewCtrl_SetCurrentPage_System_Int32_
mPdfViewCtrl.OnSetDoc += (sender, e) =>
{
mPdfViewCtrl.SetCurrentPage(3);
};

Is there a transformItems equivalent in the Android Java Libraries for Algolia?

I have a use case where i would like to render the image associated with the hits returned from an Algolia search using the Algolia Java library for Android. I am currently developing on Pie . Here is what i am doing :
I use com.algolia.instantsearch.core.helpers.Searcher
I bind the results to a fragment which has a layout with the algolia attributes for images
<ImageView
algolia:attribute='#{"image_url"}'
>
The trouble is that the response JSON only stores the name of the JPG image which needs to be displayed. I need to dynamically add the base site URL and some more path specifiers . I tried doing something like this
algolia:attribute='https://somedomain.com/somepath1/ProductImages/#{"BaseProductId"}/thumbnails/#{"image_url"}
But that was not accepted.
I am looking for a way to transform the results so i can build the complete URL and place it in the image_url and then use it in the layout as stated in the first code fragment.
Is there any way to do it ?
I solved it by adding a listener and updating the hits object as seen below.
searcher.registerResultListener(new AlgoliaResultsListener() {
#Override
public void onResults(#NonNull SearchResults results, boolean isLoadingMore) {
for (int i=0;i<results.hits.length();i++){
try {
JSONObject obj = results.hits.getJSONObject(i);
String image_url_file = obj.getString("image_url");
String base_product_id = obj.getString("BaseProductId");
String full_image_path = "https://somedomain.com/somPath/ProductImages/"+base_product_id+"/Original/"+image_url_file;
results.hits.getJSONObject(i).put("image_url",full_image_path);
}catch(Exception exx){
}
}
}
}
);

Accessibility Identifier issue in ReactNative

I am setting accessibility identifier for my components in react native using testID in iOS and accessibilityLabel in android. For iOS is working fine but for Android it my identifier is appended with , (a comma and a space). I am not sure what is causing issue. Here is my code:
const renderAccessibilityLabel = (str) => {
const propsForAutomation = {};
if (Platform.OS === "ios") {
propsForAutomation.testID = str;
} else {
propsForAutomation.accessibilityLabel = str;
}
return propsForAutomation;
};
// Inside render method:
<Text {...renderAccessibilityLabel("MyText")}>{MyText}</Text>
result > ios: MyText
android: MyText,
I don't know whats wrong with code :(
There was a bug with react native that was fixed in 0.60.5.
My guess is you are using an earlier version (0.60), updating will correct this.
Problem occurs in ReactAndroid/src/main/java/com/facebook/react/uimanager/BaseViewManager.java
Line 178 contentDescription.append(accessibilityLabel + ", ");
Just in case you can't update for any reason, it can be fixed by adding contentDescription = contentDescription.replaceAll(", $", ""); just above the line if (contentDescription.length() > 0) {
Or by replacing the file with the changes in https://github.com/facebook/react-native/commit/812abfd.

MathJax not rendering correctly

I am currently using this library in my app: https://github.com/kexanie/MathView
which is used to convert text into maths, it uses TeX/MathJax.
This was working as expected:
MathView mv = new MathView(context, null);
mv.setEngine(MathView.Engine.MATHJAX);
mv.config("MathJax.Hub.Config({\n" +
"jax: [\"input/TeX\",\"output/HTML-CSS\"],\n" +
"displayAlign: \"left\"" +
"});"
);
mv.setText(context.getString(id));
where "id" pointed to a resource in strings.xml file.
Now, I changed it to be contained inside a file, and getting it from there.
MathView mv = new MathView(context, null);
mv.setEngine(MathView.Engine.MATHJAX);
mv.config("MathJax.Hub.Config({\n" +
"jax: [\"input/TeX\",\"output/HTML-CSS\"],\n" +
"displayAlign: \"left\"" +
"});"
);
String a= text;
mv.setText(a);
where text is received from the file, but is same as the earlier one in strings.xml, I logged that to verify.
But now the output is broken. It doesn't recognise the text correctly
"\frac{a}{b}" earlier used to be "a/b", now it is "fracab"
Is it a library issue?
I have used MathJax in angular4 project. It might help you out in your project as well.
use cdnjs link for mathjax library:
<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?
config=TeX-MML-AM_CHTML"></script>
create mathjax directive:
import {Directive, ElementRef, Input, OnChanges} from'#angular/core';
declare var MathJax:any;
#Directive({
selector : '[mathText]',
})
export class MathTextDirective implements OnChanges {
constructor(public elementRef: ElementRef) {
this.hostEl = elementRef.nativeElement; //capture the HTML
element host
}
//Used to bind data: eg: <div [mathText]="raw string">
#Input('mathText') inputString:string;
// host element
private hostEl:HTMLElement;
//have MathJax parse the host element and render the math
render(){MathJax.Hub.Queue(['Typeset', MathJax.Hub, this.hostEl])}
// called when the inputString changes.
ngOnChanges(){
//make the input string into the innerText of the host element
this.hostEl.innerText = this.inputString;
this.render();
}
}
Register this directive in app.module.ts
and use this directive in html like:
<div [mathText]="\frac{a}{b}"></div>

Xamarin FacebookClient

I am using Xamarin Forms and want to integrate Facebook in android app. I want to pull the feed from a page like https://www.facebook.com/HyundaiIndia
I have installed Xamarin.Facebook from Nuget. It doesn't have a FacebookClient object as mentioned in here: https://components.xamarin.com/gettingstarted/facebook-sdk
Then I found the Xamarin.Facebook and Xamarin.FacebookBolts namespaces which I included, but I still didn't get FacebookClient. Instead I found Xamarin.Facebook.XAndroid.Facebook and I created an instance:
Xamarin.Facebook.XAndroid.Facebook fb = new Xamarin.Facebook.XAndroid.Facebook(FacebookAppId);
But this object doesn't have GetTaskAsync. How do I pull down the feeds in Xamarin?
I had the same experience trying following the article you mentioned.
The component created by Outercurve Foundation (Facebook.dll version 6.2.1)
needs that you reference Facebook.dll and you include it in your file like this:
using Facebook;
Don't confuse it with:
using Xamarin.Facebook;
EDIT
I finally found a bit of time for a more complete answer and since the example on the link
doesn't specify how to obtain the AccessToken (called userToken in the facebook-sdk component page example linked in the question) I'm posting one of the possible solutions.
This one works for me and doesn't require any other library or component (but the one already mentioned in the question).
using Xamarin.Auth;
using Facebook;
string FaceBookAppId = "YOUR_FACEBOOK_APP_ID";
string AccessToken;
string OauthTokenSecret;
string OauthConsumerKey;
string OauthConsumerSecret;
void GetFBTokens()
{
var auth = new OAuth2Authenticator(FaceBookAppId,
"",
new Uri("https://m.facebook.com/dialog/oauth/"),
new Uri("https://www.facebook.com/connect/login_success.html")
);
auth.Completed += (sender, eventArgs) =>
{
if (eventArgs.IsAuthenticated)
{
eventArgs.Account.Properties.TryGetValue("access_token", out AccessToken);
eventArgs.Account.Properties.TryGetValue("oauth_token_secret", out OauthTokenSecret);
eventArgs.Account.Properties.TryGetValue("oauth_consumer_key", out OauthConsumerKey);
eventArgs.Account.Properties.TryGetValue("oauth_consumer_secret", out OauthConsumerSecret);
}
};
}
//Now we can use the example of the link.
void PostToMyWall ()
{
FacebookClient fb = new FacebookClient (AccessToken);
string myMessage = "Hello from Xamarin";
fb.PostTaskAsync ("me/feed", new { message = myMessage }).ContinueWith (t => {
if (!t.IsFaulted) {
string message = "Great, your message has been posted to you wall!";
Console.WriteLine (message);
}
});
}
There are 2 editions of Facebook SDK, one is binding for official SDK, another is from Outercurve Foundation.
Looks like you're using this one: the "official" binding , so check the documentation on this link.

Categories

Resources