Huawei Cluster Map and View Marker - react-native

I am creating a project in React Native for Huawei and i use this library: "#hmscore/react-native-hms-map".
When creating the map, how can I place the view inside the markup?
In MapView I can put inside and draw anything, however in HMSMarker it doesn't allow me, is there a way?
Groups only join when there are at least 6 marks together, is there a way to make groups of 2 marks together?
Thank you very much in advance.

Marker can be customized in icon mode:
You can find the parameter description here:
https://developer.huawei.com/consumer/en/doc/development/HMS-Plugin-References/marker-0000001051150162#section8565252375
And the sample code:
<HMSMarker
icon={{
uri: Image.resolveAssetSource(
require("../assets/galata-tower.png")
).uri,
width: 140,
height: 150,
}}
>
The min marker number in cluster cannot be changed.

If you want to set title and snippet for the marker, it is supported like :
Or you can define a InfoWindow.
But if you want to define the view of the marker, you cannot use "View" directly.

Related

Flatlist vs map callback columns in React native

I am trying to show a bunch of images in rows of 3 images and using Flatlist i got this error "Can't perform a React state update on an unmounted component". I tried everything about using an unmount flag but the problem still persists.
However, noticed that with the map() callback function that problem doesn't exist. The problem is how to create A View with map() in order to render 3 images at each row. Is there a possible way to create a View with 3 columns using map()?
If your problem is "The problem is how to create A View with map() in order to render 3 images at each row." then i'll answer your question with a .map() answer instead of a flatlist answer.
For .map() it will render as many images as there are in the array that you've called .map on. The spacing in that scenario is moreso done by the container you've wrapped it in, plus you can give each image a width of '33%'. Meaning, you'll want something like this:
<View style={{flexDirection: 'row', flexWrap: 'wrap'}}>
{YOURARRAY.map(() => {
return(
---- your image with the style {width: '33%'} here ----
)}
<View>

Panda 3D field of view (FOV)

I create 3 cameras for different points of view but now I want to change the field of view for each camera to 120.
How can I do that?
You can use the setFov call for each camera, for example:
camera1.node().getLens().setFov(120)
camera2.node().getLens().setFov(120)
camera3.node().getLens().setFov(120)
If you wish to explicitly specify both the horizontal and vertical field of view, you should use the two-parameter version of setFov.

Grayed out products that are not available

I would like products that are not available on the listings to be displayed in a different color. Ideally, they would be gray or transparent to stand out from those available. How can I achieve this?
https://medpak.com.pl/suplementy-diety/
First of all, if product is not available then it wouldn't be show on the listing unless you set in prestashop panel that you allow to order unavailable products - but why then make them look different if I can still order them?
Anyway, to achieve your target:
Find inside your product-list.tpl line where is code for single product, and to the value of class for element product-container add a little code below to make it look like this:
<div class="product-container {if $product.quantity <= 0}product-grayed{/if}">...</div>
Then in your css add:
.product-grayed img {
opacity: 0.5; // this code for transparent image
filter: grayscale(100%); // this code for gray image
}
Make any other css changes using added class product-grayed

React Native - Position child view above parent's view sibling

I build a textinput like facebook's mentions. After typing # you get a list with different hashtags. I have two of them on one site, one for the title and one for the text.
The problem is, that the hashtag-list from the title is displayed below the text of the content. See Screenshot for that:
The list of hashtags is behind the lorem ipsum content
I tried using the zIndex but it does not have any effect here.
The hierachie is as follows:
View:
-- MentionsText Title
--- #List for Title
-- MentionsText Content
--- #List for Content
As you can see, the content is below the title in the hierachy. That positions it correctly on the screen, but displayes itself above the list of the title. Is there any way of accomplishing it with a smooth solution?
Try wrapping your blocs into views independently, don't use absolute position.
Btw if your list can grow without limit you may need a ScrollView or FlatList.
I found a solution that contains wrapping both textinput in one view, changing the order (content first, then title) and then setting flexDirection of the view to 'column-reverse'. That way the title is again on top and the z-index is now correctly set too. Just doesnt seem very nice, maybe someone got a tip to improve it. The code is the following (note that the MentionsTextInput contains the List as a child):
<View style={{flexDirection:'column-reverse'}}> //The newly added view
<MentionsTextInput //The content of the page
style={styles.inputContent}
placeholder={I18n.t("descriptionInput")}
value={this.state.description}/>
<MentionsTextInput //The title
style={styles.inputTitle}
placeholder={I18n.t("noteTitle")}
value={this.state.title}/>
</View>

Widget integrated going out of its own zone

I got a main window (Item) with a 640*480 size.
I integrated a custom widget defined in another qml file, its size is 100*100. This item contains a Pathview that only shows 3 items from a list containing a lot of items.
The thing is that when I add my CustomPathView to my main window at coords (0, 0), the PathView goes to the bottom of my main window, displaying 7/8 items... (?!?)
My CustomPathView.qml file starts with :
Item {
width: 100
height: 100
That's why I really don't understand why it is displaying 8 items...
Did I do something wrong ? Do I have to precise to my CustomPathView that he can't go out of its zone (how ?) ?
Thanks in advance for any help about it !
Just set the clip property to true.