Button styling not not respecting styleName="" - shoutem

I am using the latest install of ShoutemUI 0.21.3 and RN 0.42.2. All buttons just have a white background. I am not using Shoutem Themes right now. I have tried styleName="confirmation" and still just a white button and no border. Am I missing something?
Here is the code on the left and the results on the right in the simulator.
Here is a screenshot of my imports.

The UI package has a theme.js file with all these styleName's. In order to utilize it, you need #shoutem/theme installed. It's a dependency of #shoutem/ui.
Furthermore, the dark styleName is obsolete. You should utilize secondary instead for the desired effect.

Related

Reactnavigation in RTL languages

So issue is that one of the app i working on as react-native developer is using
Material Top Tabs Navigator
Which is officially recommended by react-native but since it is depended on
react-native-tab-view
react-native-pager-view
and apparently react-native-tab-view have issue with RTL it not work properly.
Also in there limitation they also mention that rtl support is limited
https://reactnavigation.org/docs/limitations/
For me my app is causing weird behaviour in rtl and i want to ask about probable solutions for this
I am able to fix this issue by forking the "react-native-pager-view" but issue remain that mean i also have to fork "Material Top Tabs Navigator" as i want to use my own pager view.
One more solution i come up with is to write my own library by using native scrollview.
So what you suggest what is better option. In case one i have to wait for their solution until then i just have to keep my fork repository up-to-date but complete dependency on update for rtl.
In case 2 i have to maintain my code by myself but i good side full control over code.
which is the better option according to you and why ?

Compose Desktop: How to Access Extended Material Icon Set?

I am making an app using Compose for Desktop. I am trying to include a simple file download Icon that I know is included in the lengthy set of Material Icons, however it is not available under Icons.Filled. Some of the icons included, in my opinion, are nowhere near as commonly used as download... go figure.
I know that Compose for Android has a dependency for an extended set of Material Icons. I tried adding that dependency to my Desktop app, but it threw errors at me.
For now I have added a Feather Icons set courtesy of DevSrSouza, but I would like to know if there is a way to access the Material Icons extension in Compose for Desktop? Thanks.
I guess you have already found the answer but I also had this problem for long time, so here is a right dependency for compose desktop: "org.jetbrains.compose.material:material-icons-extended-desktop:$compose_version"

How to apply color to lottie-react-native icon

I have gone through the complete documentation of lottie-react-native but i didn't get any example or description that talks about setting color to an icon. But i finally an issue issue which suggests as follows,
colorFilters={[{
keypath: layer,
color: colorHex
}]}
I am not sure about following things here since I am very new using such a icons,
1.How to find out that how many layers are there in an icon?
2.Is there any property to set single color for whole icon? If so what is it?
Though this question is specific to lottie-react-native, I am seeking help here as well. Because if any of our users has already used this package, They may help in this regard.
Thank You.lottie-react-native
Thank you.
If you want to use other library, you can go for vector icons.
Try this library which provides range of icons.
https://youtu.be/BjrlrGy_HaY
This includes installation of vector icons npm package and demonstrates the uses of vector icons library.
Also you can change the size and color of whole icons.

v-app-bar component bug since update my dependencies

I'm new here.
I use the vueJS and vuetify framework for almost 1 year and the v-app-bar component bug since I updated all my dependencies.
My version of vue js : 2.6.11
My version of vuetify before the bug : 2.2.3
I took screenshots and modified them with paint. I highlighted the divs with a black fill and yellow border.
As shown in the following picture :
I have an app-bar upstairs,
a navigation-drawer under the app bar on the left side of the screen
a v-content under the app bar in the middle
picture before bug
So far, so good. Yesterday I updated my dependencies (which I will do more often now). Below is the update:
picture maj
My version of vuetify with the bug : 2.2.18
Then by relaunching the application, my bug appears.
The app bar is still on top - OK
The navigation-drawer does not take into account the app bar and is placed behind it and in top 0 - KO
The v-content has the same behaviour as the navigation-drawer - KO
All divs below the app-bar do not calculate the app-bar. But be careful, the weird thing is that this bug disappears when I refresh the page.
Look at the following image that shows the bug:
picture now bug
To better understand I have highlighted the divs above the app bar in the following image:
picture better now bug
What has changed in "vuetify" to have creating this bug?
I've tried to improve my architecture but I always find this bug.
EDIT
I found the version of vuetify when the bug appears : 2.2.5
FIXED
The problem was due to my architecture. Thanks to the community for the help.

How to get text 'shadow' effect in Silverlight Toolkit themes to work in my project

I am using the jetpack theme in my silverlight project. Everything is picking up the styles except I do not get the subtle text shadow effect that is visible on all the controls on the jetpack demo page.
Here is a screenshot - my project on the left, the demo site on the right.
Is there anything I have to do to enable the effect?
You have to use the label control in the toolkit.
Do this:
xmlns:label="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.Input"
then this
<label:Label>Icon</label:Label>