I'm trying to find a way to make the slider component from the #react-native-community/slider change it's maximumValue after it was initialized. I can't preset a maximum value since I want to allow my users to decide that value.
<Slider
onValueChange={changeSliderTitle}
step={this.state.value}
minimumValue={1}
maximumValue={this.state.value}
/>
Any help is much appreciated!
You can change the maximumValue after it has been initialized.
There are a few issues with your current code:
<Slider
onValueChange={changeSliderTitle}
step={this.state.value}
minimumValue={1}
maximumValue={this.state.value}
/>
You probably want step to be a fixed value. It determines on what increments you can move the slider by.
maximumValue can be a value from the sate, but it should be separate from the slider value.
A fixed version of the slider could look like this.
<Slider
onValueChange={(value) => {this.setState({value})}}
value={this.state.value}
step={1}
minimumValue={1}
maximumValue={this.state.maxValue}
/>
Now, you can call the following in your code to set the maximum value of the slider dynamically.
this.setState({maxValue: 1000})
Related
I m currently using the slider from react-native-community and i am having trouble doing more than one thing while using onValueChange.
now the value taken from onValueChange is set to control the strokeDashOffset (sdo) of an SVG element. It is working just fine but i need to add some more rendering depending on the slider value. That's to say for example when the value reaches 340 i need to setState something, then when it reaches 650 i need to set some other state etc...
here is the code of my slider :
<Slider style={styles.slider}
minimumValue={0}
maximumValue={1570}
value={sdo}
step={1}
onValueChange = {value => setSdo(value)}
/>
(in my svg component the strokeDashOffset is set to this sdo value but i don't feel like putting my svg code is relevant here, I guess i have to add some stuff in the onValueChange but i cannot use if statements and i have no idea how to proceed)
How can i conditionally render things based on the slider value (while stille having the slider value attached to strokeDashOffset of my SVG)?
thanks in advance !
I've just switch from react-native-maps-osmdroid to react-native-mapbox-gl and havn't succeed to change pitch yet.
I've tried to set pitch in differents ways :
- directly on MapView component
- on Camera component with props "pitch" and "followPitch"
- on Camera component with props "defaultSettings"
- with ref on Camera and call this.camera.setCamera()
However none of this ways seems to work, the only way that I succeed to change pitch is from the app with three fingers.
<MapboxGL.MapView style={{ flex: 1 }}>
<MapboxGL.Camera
followPitch={15}
zoomLevel={16}
followUserLocation
/>
<MapboxGL.UserLocation />
</MapboxGL.MapView>
No error message whatever the way I change pitch but map don't change.
Someone know how to programatically change pitch?
Looks like set followUserLocation to true overide others settings (like centerCoordinates, pitch, heading).
I probably need to handle Camera movement by myself to follow user with pitch.
Let me know if you find another solution.
I'm looking for a way to dynamically add bordered property to the button element, how can I do that?
So I need to switch from <Button> to <Button bordered>. Any way to do this without assigning an entire <Button><Text>I'm a button</Text></Button> to a variable, then duplicating the same but with bordered?
You can use true or false based on your selection. Store its value in state and when you do some operation set it to true. This is how your Button will look.
<Button bordered={this.state.isBordered}><Text>I'm a button</Text></Button>
whenever you want to change its value just use setState and it's done
this.setState({
isBordered:true
})
Update:
Combine it with transparent parameter and it will work
<Button transparent bordered={this.state.isBordered}><Text>I'm a button</Text></Button>
I want to change part of a label dynamically.
This is my code:
<View top="0" height="115">
<Label id="lblMiles" left="15" textAlign="right" right="15" top="0" height="55">
{distance} Miles
</Label>
</View>
I want to be able to change the {distance} portion dynamically.
However currently I can only change the whole thing like this:
$.lblMiles.text = "10 Miles";
In HTML we normally use a span tag like so:
<div id="lblMiles"><span id="distance"></span> Miles</div>
How can I do something similar in Alloy?
If it were up to me, i wouldn't worry about updating only half the label, just reset the whole text,
$.lblMiles.text = "10 Miles";
// and then later on to update it to 15
$.lblMiles.text = "15 Miles";
if for some reason you need to update only half, then you could use two labels and put them in a view with layout set to horizontal.
something looking like this :
<View top="0" height="115">
<View height="Ti.UI.SIZE" width="Ti.UI.SIZE" layout="horizontal">
<Label id="dynamicLabel" />
<Label id="lblMiles" > Miles</Label>
</View>
</View>
and then in your code, just update the dynamic label setting the actual value:
$.dynamicLabel.text = "15";
Now to position the labels on the screen you should play on the attributes of their container's left, right, top and bottom.
You can do this by two three ways
Have two different labels and set it from controller
You can use attributed strings as well.
More reference is here http://docs.appcelerator.com/platform/latest/#!/guide/Attributed_Strings
I have bug in struts2-grid-Jquery.Every time grid contains only one record ,grid disappear the record as in hyperlink but if there are more than one record it work fine. My code :
<sjg:grid id="gridtable"
dataType="json"
href="%{remoteurl}"
gridModel="allCustomerRequests"
pager="true"
page="1"
rowNum="10"
pagerButtons="true"
pagerInput="true"
gridview="true"
rowTotal="true"
rownumbers="true"
rowList="10,20,30,40,40,50,60,70,80,90,100"
viewrecords="true"
autowidth="true"
loadonce="true"
viewrecords="true"
>
<sjg:gridColumn name="stRefID" formatter="formatViewLink"
title="%{getText('COMMON_REFERENCE_NUMBER')}" />
<sjg:gridColumn name="requestType.stName"
title="%{getText('RequestTracking_Request_Type')}" />
<sjg:gridColumn name="requestStatus.stStatus"
title="%{getText('RequestTracking_Request_Status')}" />
<sjg:gridColumn name="requestStatus.tsDate"
title="%{getText('DATE')}"
formatoptions="{newformat : 'd/m/Y',
srcformat : 'Y-m-d'}" formatter="date" />
</sjg:grid>
Please help me to solve my bug
enter link description here
I m pretty sure you are expriencing this issue with IE...?
It has nothing to do with the grid plugin but the way IE includes the size of scroll bar when calculating height/width.
A workaround for you is to fix the height of your grid using the height attribute of <sjg:grid />.