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: 151
Registered: ‎10-30-2010
My Device: Priv
My Carrier: T-Mobile
Accepted Solution

Trying to get segmentedControl to toggle between Containers

[ Edited ]

Hi all,

 

I'm trying to get a segmentedControl to toggle between the visiblity of two separate containers driverBioText and driverStatsList. I'll paste my code, and maybe someone can point out what I am doing wrong? I'm still a programming noob.

 

------

 

SegmentedControl {
id: segmentedDrivers
Option {
id: biography
text: "Biography"
value: "biography"
selected: true
}
Option {
id: statistics
text: "Statistics"
value: "statistics"
}
onSelectedIndexChanged: {
var value = segmentedDrivers.selectedValue()
console.debug("Selected value: " + value);
if(value = "biography") driverBioText.visible = true()
else driverStatsList.visible = true()
}
}

Container {
ScrollView {
TextArea {
id: driverBioText
rightPadding: 30.0
leftPadding: 30.0
visible: false
editable: false
topMargin: 10.0
}

}
}

 

Container {

ScrollView {
TextArea {
id: driverStatsList
rightPadding: 30.0
leftPadding: 30.0
visible: false
editable: false
topMargin: 10.0
text: "driver stats"
}
}
}

 

-----

 

Thanks!

Developer
Posts: 526
Registered: ‎05-17-2009
My Device: 9900
My Carrier: ATT

Re: Trying to get segmentedControl to toggle between Containers

true is just a value not a function, so it should be true and not true()
Like all of my posts
Developer
Posts: 151
Registered: ‎10-30-2010
My Device: Priv
My Carrier: T-Mobile

Re: Trying to get segmentedControl to toggle between Containers

Thank you.

 

You're referring to where I have

 

if(value = "biography") driverBioText.visible = true()
else driverStatsList.visible = true()

 

right?

 

I removed the ()'s after true on both and it didn't seem to fix it though.

Developer
Posts: 526
Registered: ‎05-17-2009
My Device: 9900
My Carrier: ATT

Re: Trying to get segmentedControl to toggle between Containers

that i was. Even if it might not have worked, thats still the right way to do that. One other thing to try is put an ID on the containers instead of the text fields since thats what you are trying to hide. Or put both textareas in the same scrollview. Theres no need for duplicating things if only one will be visible at a time
Like all of my posts
Developer
Posts: 151
Registered: ‎10-30-2010
My Device: Priv
My Carrier: T-Mobile

Re: Trying to get segmentedControl to toggle between Containers

I see. I have tried different variations like you mentioned. I even tried attaching ids to the individual Containers and referring to them instead of the TextArea ids themselves under onSelectedIndexChanged.

 

The other method you mentioned didn't work because I can't list two separate TextArea components under one ScrollView. I get the error

 

The default property for the component 'ScrollView' does not accept several objects.

Developer
Posts: 526
Registered: ‎05-17-2009
My Device: 9900
My Carrier: ATT

Re: Trying to get segmentedControl to toggle between Containers

If you do it that way you have to put both textfields inside a single container in the scrollview
Like all of my posts
Developer
Posts: 151
Registered: ‎10-30-2010
My Device: Priv
My Carrier: T-Mobile

Re: Trying to get segmentedControl to toggle between Containers

[ Edited ]

Yeah, that won't work unless I also use two different ScrollViews. I can't do one Container, then one ScrollView, with two separate TextAreas. I get an error.

 

So instead I did one Container, then two ScrollViews inside of that, each with the corresponding TextAreas.

 

Does that make sense?

 

Edit: Unless you meant do one single ScrollView with the Container nested in it, containing both TextAreas. That works. But again my problem isn't solved. Smiley Sad

Highlighted
Developer
Posts: 526
Registered: ‎05-17-2009
My Device: 9900
My Carrier: ATT

Re: Trying to get segmentedControl to toggle between Containers

Yeah, i did mean your edit. Id keep it that way. Are you sure the on selectedchanged is getting called?

In there you also need to have if(value == "biography") and not a single =
Like all of my posts
Developer
Posts: 151
Registered: ‎10-30-2010
My Device: Priv
My Carrier: T-Mobile

Re: Trying to get segmentedControl to toggle between Containers

It still didn't seem to do the trick.

 

----

 

// Tabbed Pane project template
import bb.cascades 1.0

Page {
property alias driverPhoto : driverPhotoURL.imageSource
property alias driverBio : driverBioText.text
property alias driverName : driverListInfo.title
property alias driverTeam : driverListInfo.description
property alias driverNumber : driverListInfo.status
property alias driverFlag : driverListInfo.imageSource

Container {

ImageView {
id: driverPhotoURL
scalingMethod: ScalingMethod.AspectFill
minHeight: 481.0
}


StandardListItem {
id: driverListInfo
}

SegmentedControl {
id: segmentedDrivers
Option {
id: biography
text: "Biography"
value: "biography"
selected: true
}
Option {
id: statistics
text: "Statistics"
value: "statistics"
}
onSelectedIndexChanged: {
var value = segmentedDrivers.selectedValue()
console.debug("Selected value: " + value);
if(value == "biography") driverBioText.visible = true
else driverStatsList.visible = true
}
}

ScrollView {
Container {
id: textContainer

TextArea {
id: driverBioText
rightPadding: 30.0
leftPadding: 30.0
editable: false
topMargin: 10.0
visible: false
}

TextArea {
id: driverStatsList
rightPadding: 30.0
leftPadding: 30.0
editable: false
topMargin: 10.0
text: "Driver Stats"
visible: false
}

}
}

}
}

 

--

 

That's the whole code for this QML. Neither of the text boxes seem to show. Maybe the whole code will give you a better idea? I appreciate the help.

Developer
Posts: 526
Registered: ‎05-17-2009
My Device: 9900
My Carrier: ATT

Re: Trying to get segmentedControl to toggle between Containers

So theres no errors in the console? And does it print out "Selected value: biography"? I also just saw in the docs that selectedValue is a property and not a method, so take the () off .selectedProperty too

Im not 100% familiar with javascript so I dont know what the exact syntax is but id write that if block like this for readability
if(value == "biography") {
driverBioText.visible = true;
driverStatsList.visible = false;
} else {
driverBioText.visible = false;
driverStatsList.visible = true;
}
Like all of my posts