Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Developer
Posts: 97
Registered: ‎11-13-2012
My Device: BB10 Simulator
My Carrier: Globe Telecom
Accepted Solution

HELP ContactPicker Multiple in QML

I have this code

 

ActionItem 
            {
                title: "Invite Contacts"
                ActionBar.placement: ActionBarPlacement.OnBar
                imageSource: "asset:///images/titleAddFriend.png"
                onTriggered: 
                {
                    contactPicker.open();
                }
                
                attachedObjects: ContactPicker 
                {
                    id: contactPicker
                    mode: ContactSelectionMode.Multiple
                    onContactsSelected:
                    {
                        for(var i = 0; i < selectedContactsIds.length; i++)
                        {
                            var phoneNumber = _app.getContactPhoneNumber(selectedContactsIds[i]);
                            console.log("PHONE: " + phoneNumber);
                        }
                    }
                }
            }

 but just doesn't work as multiple picker. it still work as the default single contact picker. I have added a qml register type in main.cpp and all the libs are imported too. any suggestions please? this issue is present both 10.1 and 10.2.1 OS I've tried.

Developer
Posts: 825
Registered: ‎10-16-2012
My Device: Red Z10
My Carrier: Rogers

Re: HELP ContactPicker Multiple in QML

Sorry, I don't have a solution to this issue.  You may already be doing this but just wanted to put in that if you dynamically create the attached objects by setting a variable to change in your root containers onCreationCompleted it will greatly improve your loading time.

 

performance-wise I've found it best to do this for any attached object that isnt immidately needed before the main content is presented.

 

Developer
Posts: 97
Registered: ‎11-13-2012
My Device: BB10 Simulator
My Carrier: Globe Telecom

Re: HELP ContactPicker Multiple in QML

Thanks for the tip. I actually need performance tips. But I don't know how to do that what you said. How do I create the attached objects in the onCreationComplete of my root container?
Developer
Posts: 825
Registered: ‎10-16-2012
My Device: Red Z10
My Carrier: Rogers

Re: HELP ContactPicker Multiple in QML

[ Edited ]

I just learned how to do this effectively 2-3 weeks ago Smiley Wink

 

Page {
    id: myPage
    Container {
        id: root
        
        property bool loaded
        property variant attached
        
        onLoadedChanged: {
            if (loaded){
                root.attached = myAttachedObjects.createObject(myPage)
                loaded = false
            }
        }
        
        attachedObjects: [
            ComponentDefinition {
                id: myAttachedObjects
                Container {
                    id: objects
                    
                    property alias objectInteract: layoutHandler
                    attachedObjects: [
                        //attached objects here
                        LayoutUpdateHandler {
                            id: layoutHandler
                            onLayoutFrameChanged: {
                            console.log("Layout X - " + layoutHandler.layoutFrame.x + " Y - " + layoutHandler.layoutFrame.y)
                            }
                            onCreationCompleted: {
                                console.log("Layout X - " + layoutHandler.layoutFrame.x + " Y - " + layoutHandler.layoutFrame.y)
                            }
                        }
                    ]
                }
            }
        ]
        
        
        onCreationCompleted: {
        root.loaded = true;
        }
    }
}

 

Also if you create any objects that you dont need when the app is minimized or at some point simply calling destroy on the alias will get rid of it.  media keys will continue blocking volume control unless destroyed when minimized and reacreated when the app is fullscreen

 

onSomethingHappened: {
   if (root.attached){
     root.attached.destroy();
   }
}

 

if you needed to interact with objects in your component definition just reference the alias of the object you need

 

myAttachedObjects.objects.objectInteract   (.doSomething if not read-only object)

 

Developer
Posts: 97
Registered: ‎11-13-2012
My Device: BB10 Simulator
My Carrier: Globe Telecom

Re: HELP ContactPicker Multiple in QML

Thank you so much for this. I really need a lot of optimizations and this will help. Smiley Happy Thanks so much, But I also wish there's a solution to the problem I have above. Smiley Sad
Developer
Posts: 825
Registered: ‎10-16-2012
My Device: Red Z10
My Carrier: Rogers

Re: HELP ContactPicker Multiple in QML

[ Edited ]

I figured it out.... its another case of QML can't handle it.  After testing out your code i noticed this error 

 

file:///apps/com.example.dynamicattach.testDev_namicattach58cf113_/native/assets//main.qml:51: ReferenceError: Can't find variable: ContactSelectionMode

 So I tried importing ContactSelectionMode to qml like the picker is with no succes.

 

So then I stuck with c++ for the picker and got working results

 

The solution

 

applicationUI.cpp

#include <bb/cascades/pickers/ContactPicker>
#include <bb/cascades/pickers/ContactSelectionMode>
void ApplicationUI::contacts()
{
	  ContactPicker *contactPicker = new ContactPicker();
	  contactPicker->setMode(ContactSelectionMode::Multiple);
	  contactPicker->setKindFilters(QSet<bb::pim::contacts::AttributeKind::Type>()
	       << bb::pim::contacts::AttributeKind::Phone);

	  bool success = QObject::connect(contactPicker,
	         SIGNAL(contactsSelected(QList<int>)),
	         this,
	         SLOT(onContactsSelected(QList<int>)));

	  if (success) { // Signal was successfully connected.
	  	    contactPicker->open();
	  	  } else { // Failed to connect to signal.
	  	    qDebug() << "Didn't connect the picker signal";
	  	  }
}

void ApplicationUI::onContactsSelected(const QList<int> &contactIds) {

	qDebug() << "contacts" << contactIds;
}

 

applicationUI.hpp

public:
    ApplicationUI(bb::cascades::Application *app);
    virtual ~ApplicationUI() { }

    Q_INVOKABLE void contacts();

public slots:
	void onContactsSelected(const QList<int> &contactIds);

 .qml

Button {
                id: contact
                text: "Pick Contact"
                onClicked: {
                    cpp.contacts();
                }
                
            }

 

Now since the function is completely in c++ you should be able to take your code from 

_app.getContactPhoneNumber(selectedContactsIds[i]);

 and just insert it into onContactsSelected to get your phone numbers

 

Hope it helps!  Now I know how to do it too =)

 

P.S.

If you ever run into an issue where something should certainly be working and it isn't, it's very likely you'll achieve success if you just switch it over to c++ code as theres likely an issue with the QML support.

Developer
Posts: 97
Registered: ‎11-13-2012
My Device: BB10 Simulator
My Carrier: Globe Telecom

Re: HELP ContactPicker Multiple in QML

Thank you so much. this solved the problem Smiley Happy i made a C++ file with the code and added a signal onComplete and registered it so QML can read it as a component.. now it behaves exactly as it should originally be,. Smiley Happy thanks so much.
Developer
Posts: 97
Registered: ‎11-13-2012
My Device: BB10 Simulator
My Carrier: Globe Telecom

Re: HELP ContactPicker Multiple in QML

I tried your attachedobjects optimization but I always get this 

 

TypeError: Result of expression 'myAttachedObjects.objects' [undefined] is not an object.

 

I followed everything correctly Smiley Sad

Developer
Posts: 825
Registered: ‎10-16-2012
My Device: Red Z10
My Carrier: Rogers

Re: HELP ContactPicker Multiple in QML

[ Edited ]

The best way to do that is like this

 

Container {
    id: root
    property variant mAttached

    attachedObjects: [
            ComponentDefinition {
                id: myAttachedObjects
                Container {
                    id: objects
                    
                    property alias objectInteract: layoutHandler
                    attachedObjects: [
                        //attached objects here
                        LayoutUpdateHandler {
                            id: layoutHandler
                            onLayoutFrameChanged: {
                            console.log("Layout X - " + layoutHandler.layoutFrame.x + " Y - " + layoutHandler.layoutFrame.y)
                            }
                            onCreationCompleted: {
                                console.log("Layout X - " + layoutHandler.layoutFrame.x + " Y - " + layoutHandler.layoutFrame.y)
                            }
                        }
                    ]
                }
            }
        ]

onCreationCompleted: {
   if (!root.mAttached){
       root.mAttached = myAttachedObjects.createObject(root)
   }
   console.log("Width: " + mAttached.objectInteract.layoutFrame.width)
}

}

 This is best used with more advanced controls such as pickers, toats, dialogs etc but can be applied to pretty much anything.

 

When you want the control just run the code that's in onCompleted

 

to destroy it

if (root.mAttached){
       root.mAttached.destroy()
   }

you can insert dynamic controls into containers with someContainer.add(mAttached) and remove them with someContainer.remove(mAttached)

Developer
Posts: 97
Registered: ‎11-13-2012
My Device: BB10 Simulator
My Carrier: Globe Telecom

Re: HELP ContactPicker Multiple in QML

Thank you very much Kyle!! Now it works and the app start time has improved !!