access context property from listview checkboxitem when onchechchanged - qml

my qml:
if i create a button and call " _model.writeapp(appname);" from its click event it works fine, but not from the listview checkbox oncheckedchanged event
context is defined
Container {
ListView {
id: listid
dataModel: _model
function getAppName() {
return (_model.readApp());
}
function writeappName(appname) {
_model.writeapp(appname);
}
//! [1]
listItemComponents: [
ListItemComponent {
id: listcomp
type: "item"
Container {
id: conchk
CheckBox {
id: chkbx
text: ListItemData.appname
onCheckedChanged: {
console.log("checked")
if (checked) {
//have to call _model.writeapp(appname);
chkbx.ListItem.view.writeappName("hi")
}
}
}
}
}
]
}
}

Try changing this:
chkbx.ListItem.view.writeappName("hi")
To this:
conchk.ListItem.view.writeappName("hi")

Related

Add a contact/pin to BBM from BB 10 Native App

In my BB 10 cascades App , I need to add a Button click listener for Adding a contact information like pin:210000A to Blackberry Messenger (BBM). for that I am doing the following...
main.qml is like
import bb.cascades 1.0
Page {
Container {
layout: DockLayout {
}
TextArea {
id: pinEditor
hintText: "Enter PIN to invite"
onTextChanged: {
inviter.pin = text
}
input.submitKey: SubmitKey.Send
}
Inviter {
id: inviter
horizontalAlignment: HorizontalAlignment.Center
verticalAlignment: VerticalAlignment.Center
}
}
}
and Inviter.qml is like
import bb.cascades 1.0
Container {
property string pin
Button {
text: "Invite to BBM"
onClicked: {
query.uri = "pin:" + pin
invoke.trigger("bb.action.INVITEBBM")
}
}
attachedObjects: [
Invocation {
id: invoke
query: InvokeQuery {
id: query
invokeTargetId: "sys.bbm.sharehandler"
onQueryChanged: {
invoke.query.updateQuery()
}
}
}
but I am getting "Read only property cannot be set"error in Qml.I have also added
LIBS += -lbbplatformbbm
LIBS += -lbbsystem and BBM Permission in "bar-descriptor.xml"
Do I need to Register with BBM for Adding contact in BBM from my App? and how to fix the above error?
Please help,
Thanks
I'm guessing here, but try this way:
Container {
property string pin
Button {
text: "Invite to BBM"
onClicked: {
invoke.query.setUri("pin:" + pin)
invoke.trigger("bb.action.INVITEBBM")
}
}
attachedObjects: [
Invocation {
id: invoke
query {
invokeTargetId: "sys.bbm.sharehandler"
onQueryChanged: {
invoke.query.updateQuery()
}
}
}
]
}

Accessing ListItemComponents on the run

right now I'm trying to create a ListView which loads the dataModel using a custom QML. Here's the snippet of my code:
ListView {
id: firstPageListView
visible: false
dataModel: firstPageDataModel
layout: GridListLayout {
columnCount: 1
cellAspectRatio: 2.0
headerMode: ListHeaderMode.Standard
verticalCellSpacing: 10
}
listItemComponents: [
ListItemComponent {
//custom qml that will be used
ThumbNote {
title: ListItemData.title
text: ListItemData.text
imageSource: ListItemData.image
listmode: true //list mode
date: ListItemData.date
}
}
]
}
I want to create a button that will change the listmode property of each component into false. By doing so, the object will invoke a function that set in the onListModeChanged() of the ThumbNote QML.
Sorry for my poor english, any help would be appreciated. :)
Perhaps you might consider adding a property to the ListView and binding the ThumbNotes' properties to it.
E.g.:
ListView {
id: firstPageListView
visible: true
dataModel: firstPageDataModel
property bool listMode: true
...
listItemComponents: [
ListItemComponent {
//custom qml that will be used
ThumbNote {
title: ListItemData.title
text: ListItemData.text
imageSource: ListItemData.image
listmode: firstPageListView.listMode
date: ListItemData.date
}
}
]
}
Button {
onClicked: {
firstPageListView.listMode = false;
}
}

Sencha touch 2 custom list item button tap not fired

I am developing a Hybrid Mobile App over sencha touch 2.
Now I was in a need of a custom component to be specific a custom list item consisting of a button along with.
My view has rendered as i wanted to but the button that is added to the list item is not firing the TAP event as expected. Instead on every tap, the ITEMTAP event is fired which is creating a bit of mess.
Can someone suggest me where to look to make this work ?
Below is the code for the custom component that i created:
var listView = {
xtype : "list",
id : "desk-list-search-results",
cls : "desk-list-search-results-cls",
selectedCls : "",
defaultType:"desksearchlistitem",
store : "deskstore",
flex : 2
};
This is the code for the custom component
Ext.define("MyApp.view.DeskSearchListItem",{
extend:"Ext.dataview.component.ListItem",
requires:["Ext.Button"],
alias:"widget.desksearchlistitem",
initialize:function()
{
this.callParent(arguments);
},
config:{
layout:{
type:"hbox",
align:"left"
},
cls:'x-list-item desk-search-list-item',
title:{
cls:"desk-list-item",
flex:0,
styleHtmlContent:true,
style:"align:left;"
},
image:{
cls:"circle_image",
width:"28px",
height:"28px"
},
button:{
cls:'x-button custom-button custom-font bookdesk-button',
flex:0,
text:"Book",
width:"113px",
height:"46px",
hidden:true
},
dataMap:{
getTitle:{
setHtml:'title'
}
}
},
applyButton:function(config)
{
return Ext.factory(config,Ext.Button,this.getButton());
},
updateButton:function(newButton,oldButton)
{
if(newButton)
{
this.add(newButton);
}
if(oldButton)
{
this.remove(oldButton);
}
},
applyTitle:function(config)
{
return Ext.factory(config,Ext.Component,this.getTitle());
},
updateTitle:function(newTitle,oldTitle)
{
if(newTitle)
{
this.add(newTitle);
}
if(oldTitle)
{
this.remove(oldTitle);
}
},
applyImage:function(config)
{
return Ext.factory(config,Ext.Component,this.getImage());
},
updateImage:function(newImage,oldImage)
{
if(newImage)
{
this.add(newImage);
}
if(oldImage)
{
this.remove(oldImage);
}
}
})
Finally got a solution to this,
It can be done into the view using the listeners object.
Here is the code sample for it.
listeners:{
initialize:function()
{
var dataview = this;
dataview.on("itemtap",function(list,index,target,record,event){
event.preventDefault();
});
dataview.on("itemswipe",function(list,index,target,record,event){
if(event.direction === "right")
{
var buttonId = target.element.down(".bookdesk-button").id;
var buttonEl = Ext.ComponentQuery.query("#"+buttonId)[0];
if(Ext.isObject(buttonEl))
{
buttonEl.setZIndex(9999);
buttonEl.show({
showAnimation:{
type:"slideIn",
duration:500
}
});
var listeners = {
tap:function(btn,e,opt)
{
console.log("Button Tapped");
}
};
buttonEl.setListeners(listeners);
}
else
{
console.log("This is not a valid element");
}
}
});
}
}
Thanks Anyways.

Invocation from function in Blackberrry 10 qml?

I have invoked invite to BBM while clicking a button in qml,but i need to send the invitation for the contacts how to do this?my code
Button {
text: "Invite"
onClicked: {
invokeQuery.uri = "pin:210000A"
invokeQuery.updateQuery();
}
attachedObjects: [
Invocation {
id: invokeShare
query: InvokeQuery {
id: invokeQuery
}
onArmed: {
trigger("bb.action.INVITEBBM");
}
}
]
}
Can anyone send me some solutions to solve this.?
Thanks
Invocation query is immutable object which means that values in the query are not dynamic. If you want to update query in dynamic you need to do it via control signals or variables.
For example, you have a component called Inviter with the pin property exposed:
import bb.cascades 1.0
Container {
property string pin
Button {
text: "Invite to BBM"
onClicked: {
query.uri = "pin:" + pin
invoke.trigger("bb.action.INVITEBBM")
}
}
attachedObjects: [
Invocation {
id: invoke
query: InvokeQuery {
id: query
invokeTargetId: "sys.bbm.sharehandler"
onQueryChanged: {
invoke.query.updateQuery()
}
}
}
]
}
Then you can use it this way:
import bb.cascades 1.0
Page {
Container {
layout: DockLayout {
}
TextArea {
id: pinEditor
hintText: "Enter PIN to invite"
onTextChanged: {
inviter.pin = text
}
input.submitKey: SubmitKey.Send
}
Inviter {
id: inviter
horizontalAlignment: HorizontalAlignment.Center
verticalAlignment: VerticalAlignment.Center
}
}
}
Also, don't forget to enable "Blackberry Messenger" permission in your bar-descriptor.xml and add following libraries to your .pro file:
LIBS += -lbbplatformbbm
LIBS += -lbbsystem

ExtJS 4 - Control events of items in MVC

I have an application in MVC with a view class:
Ext.define('a.view.Mainmenu' ,{
extend: 'Ext.menu.Menu',
alias: 'widget.mainmenu',
text: 'Menu',
items: [
{
xtype: 'menucheckitem',
id: 'mci1',
text: 'a'
},
{
xtype: 'menucheckitem',
id: 'mci2',
text: 'b'
}]
});
How I can control the click events of the menucheckitems in the controller? I want to check if the menucheckitems are checked.
I tried something in the init function of the controller, but there is an error (item.down("mci1") is null):
...
init: function() {
this.control({
'mainmenu': {
click: function(item) {
if (item.down('mci1').checked == true) {
...
}
if (item.down('mci2').checked == true) {
...
}
}
}
});
}
How I could do it right?
#Ringo,
Neither the menuitem or menucheckitem have a method of down() available to them according to the Sencha docs (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.menu.CheckItem-event-checkchange).
So, that is why those aren't working.
There is an event for the xtype of menucheckitem called 'checkchange'. This event makes the following arguments available for your function:
this (Ext.menu.CheckItem) <= the actual menucheckitem that was checked/unchecked (so mci1 or mci2 depending on which the user clicked on)
checked (Boolean) <= true if the change set the menucheckitem as checked and false if unchecked.
So, this would only require you to do something like:
...
init: function() {
this.control({
'mainmenu menucheckitem': {
checkchange: function(item, checked) {
if (checked) {
if(item.id == 'mci1'){
...
}
}else{
...
}
}
}
});
}
The item parameter is already your menu item. You don't have to query down.
so it would be:
if(item.checked && item.getId() == 'mci1'){
...
}