Community Tip - Stay updated on what is happening on the PTC Community by subscribing to PTC Community Announcements. X
I have created example widget provided from ptc developer site and i would like to add a Style property to it and I have gone through documentation of ptc and was not quite getting along so could any one suggest any way.
this is IDE code (taken from widget creation in ptc developer page)
TW.IDE.Widgets.simplewidget = function () { this.widgetIconUrl = function() { return "../Common/extensions/MyAwesomeExtension/ui/simplewidget/SimpleWidget.ide.png"; }; this.widgetProperties = function () { return { name : "SimpleWidget", description : "A simple example of Widget creation.", category : ["Common"], properties : { DisplayText: { baseType: "STRING", defaultValue: "Hello, Awesome User!", isBindingTarget: true } } } }; this.renderHtml = function () { var mytext = this.getProperty('SimpleWidget Property'); var config = { text: mytext } var widgetTemplate = _.template( '<div class="widget-content widget-simplewidget">' + '<span class="DisplayText"><%- text %></span>' + '</div>' ); return widgetTemplate(config); }; this.afterSetProperty = function (name, value) { return true; }; };
and here is the runtime js
TW.Runtime.Widgets.simplewidget = function () {
var valueElem;
this.renderHtml = function () {
var mytext = this.getProperty('SimpleWidget Property');
var config = {
text: mytext
}
var widgetTemplate = _.template(
'<div class="widget-content widget-simplewidget">' +
'<span class="DisplayText"><%- text %></span>' +
'</div>'
);
return widgetTemplate(config);
};
this.afterRender = function () {
valueElem = this.jqElement.find(".DisplayText");
valueElem.text(this.getProperty("DisplayText"));
};
this.updateProperty = function (updatePropertyInfo) {
if (updatePropertyInfo.TargetProperty === "DisplayText") {
valueElem.text(updatePropertyInfo.SinglePropertyValue);
this.setProperty("DisplayText", updatePropertyInfo.SinglePropertyValue);
}
};
};
So please tell the necessary code to be implemented so the property gets reflected in IDE and during runtime and can we make the Style as IsEditable and if we can what changes are to be made?
Solved! Go to Solution.
Check the label widget extension(IDE,Runtime JS)
Check the label widget extension(IDE,Runtime JS)