Explore all Menu open source software, libraries, packages, source code, cloud functions and APIs.
Popular New Releases in Menu
xbar
v2.1.7-beta
stats
v2.7.13
tippyjs
v6.3.3
XPopup
2.7.7
Dozer
4.2.0
Popular Libraries in Menu
xbar
by matryer 
go
15866 MIT
Put the output from any script or program into your macOS Menu Bar (the BitBar reboot)
stats
by exelban swift
10253 MIT
macOS system monitor in your menu bar
tippyjs
by atomiks javascript
9266 MIT
Tooltip, popover, dropdown, and menu library
XPopup
by li-xiaojun java
6334 Apache-2.0
🔥XPopup2.0版本重磅来袭，2倍以上性能提升，带来可观的动画性能优化和交互细节的提升！！！功能强大，交互优雅，动画丝滑的通用弹窗！可以替代Dialog，PopupWindow，PopupMenu，BottomSheet，DrawerLayout，Spinner等组件，自带十几种效果良好的动画， 支持完全的UI和动画自定义！(Powerful and Beautiful Popup for Android，can absolutely replace Dialog，PopupWindow，PopupMenu，BottomSheet，DrawerLayout，Spinner. With built-in animators , very easy to custom popup view.)
BoomMenu
by Nightonke java
5718
A menu which can ... BOOM! - Android
Dozer
by Mortennn swift
5319 MPL-2.0
Hide menu bar icons on macOS
hidden
by dwarvesf swift
5244 MIT
An ultra-light MacOS utility that helps hide menu bar icons
Side-Menu.Android
by Yalantis java
5164 Apache-2.0
Side menu with some categories to choose.
SideMenu
by jonkykong swift
5128 MIT
Simple side/slide menu control for iOS, no code necessary! Lots of customization. Add it to your project in 5 minutes or less.
Trending New libraries in Menu
rofi
by adi1090x shell
2381 GPL-3.0
A large collection of Rofi based custom Menu, Applets, Launchers & Powermenus.
phelia
by maxchehab typescript
1908 MIT
⚡ A reactive Slack application framework.
SwiftBar
by swiftbar swift
1356 MIT
Powerful macOS menu bar customization tool
react-menu
by szhsin javascript
664 MIT
React component for building accessible menu, dropdown, submenu, context menu and more.
swiftui-navigation-stack
by matteopuc swift
396 MIT
An alternative SwiftUI NavigationView implementing classic stack-based navigation giving also some more control on animations and programmatic navigation.
Fildem
by gonzaarcr python
381 GPL-3.0
Fildem global menu
Windows-terminal-context-menu
by kerol2r20 powershell
371
📃 This is a simple script to add right click context menu for your best Windows terminal ❤
NativeYoutube
by Aayush9029 swift
335 GPL-3.0
Personal App that turned into "alpha released app" v2
PiStats
by Bunn swift
311 BSD-2-Clause
macOS app to visualize Pi-hole information
Top Authors in Menu
1
9 Libraries
1283
2
5 Libraries
67
3
5 Libraries
50
4
5 Libraries
31
5
4 Libraries
41
6
4 Libraries
53
7
4 Libraries
84
8
4 Libraries
656
9
4 Libraries
9
10
4 Libraries
15002
1
9 Libraries
1283
2
5 Libraries
67
3
5 Libraries
50
4
5 Libraries
31
5
4 Libraries
41
6
4 Libraries
53
7
4 Libraries
84
8
4 Libraries
656
9
4 Libraries
9
10
4 Libraries
15002
Trending Kits in Menu
No Trending Kits are available at this moment for Menu
Trending Discussions on Menu
Chrome Dev Tools Elements Tab stopped working (can't right click any DOM Node and hover over Dom Node doesnt highlight anything)
Android Navigation Component : BottomNavigationView's selected tab icon is not updated
Fixing Cluttered Titles on Graphs
java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest;
How do I set up NUnit in Visual Studio 2022?
TopAppBar flashing when navigating with Compose Navigation
Accessing the original file name of R markdown parameters file
Native Android -> How to create custom curved bottom navigation
Angular 6 to 12 Migration: Getting Multiple Warning: Css Minimizer Plugin: > Unexpected "$"
Why checkout step not recorded in the Google Analytics report?
QUESTION
Chrome Dev Tools Elements Tab stopped working (can't right click any DOM Node and hover over Dom Node doesnt highlight anything)
Asked 2022-Mar-30 at 06:55In the Elements Tab of Chrome Dev Tools I can't right click any DOM Node anymore. I'm talking about the following menu that right click usually opens:
Furtheremore usually if you hover over DOM Nodes in the Elements Tab, the actual element on the website will be highlighted. This also doesnt work anymore. I have to explicitly left click the DOM Node and only then the element on the website will be highlighted. Before that it would work even just on hover.
I tried restarting my Browser and resetting Preferences of Dev Tools to default. Nothing works.
ANSWER
Answered 2022-Mar-09 at 18:34Yeah, it's the latest update. I've found small solution. You need to click on 3 dots near the dom element https://prnt.sc/PwvcUE8OdSAf
QUESTION
Android Navigation Component : BottomNavigationView's selected tab icon is not updated
Asked 2022-Mar-23 at 09:36I'm using BottomNavigationView with Navigation Component. When showing fragment is not root fragment, the tab icon is not updated (selected).
Example:
When I switch between Tab Home with Fragment A (which is root fragment) and Tab Star with Fragment B (which is also root fragment) it is working fine.
But when I navigate from Tab Home to another fragment, like fragment A2, and tap on Tab Star and again return to Tab Home, still Tab Star is selected in BottomNavigationView.
It was working fine with version 2.4.0-alpha05, This is happening when I updated it to 2.5.0-alpha01.
build.gradle (app)
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4build.gradle (root)
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.5.0-alpha01"
5Graph:
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.5.0-alpha01"
5<navigation xmlns:android="http://schemas.android.com/apk/res/android"
6 xmlns:app="http://schemas.android.com/apk/res-auto"
7 xmlns:tools="http://schemas.android.com/tools"
8 android:id="@+id/graph"
9 app:startDestination="@id/fragmentA">
10 <fragment
11 android:id="@+id/fragmentA"
12 android:name="ui.test.FragmentA"
13 tools:layout="@layout/fragment_test"
14 android:label="FragmentA" >
15 <action
16 android:id="@+id/action_fragmentA_to_fragmentA2"
17 app:destination="@id/fragmentA2" />
18 </fragment>
19 <fragment
20 android:id="@+id/fragmentA2"
21 android:name="ui.test.FragmentA2"
22 tools:layout="@layout/fragment_test"
23 android:label="FragmentA2" />
24 <fragment
25 android:id="@+id/fragmentB"
26 android:name="ui.test.FragmentB"
27 tools:layout="@layout/fragment_test"
28 android:label="FragmentB" />
29</navigation>
30Menu:
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.5.0-alpha01"
5<navigation xmlns:android="http://schemas.android.com/apk/res/android"
6 xmlns:app="http://schemas.android.com/apk/res-auto"
7 xmlns:tools="http://schemas.android.com/tools"
8 android:id="@+id/graph"
9 app:startDestination="@id/fragmentA">
10 <fragment
11 android:id="@+id/fragmentA"
12 android:name="ui.test.FragmentA"
13 tools:layout="@layout/fragment_test"
14 android:label="FragmentA" >
15 <action
16 android:id="@+id/action_fragmentA_to_fragmentA2"
17 app:destination="@id/fragmentA2" />
18 </fragment>
19 <fragment
20 android:id="@+id/fragmentA2"
21 android:name="ui.test.FragmentA2"
22 tools:layout="@layout/fragment_test"
23 android:label="FragmentA2" />
24 <fragment
25 android:id="@+id/fragmentB"
26 android:name="ui.test.FragmentB"
27 tools:layout="@layout/fragment_test"
28 android:label="FragmentB" />
29</navigation>
30<?xml version="1.0" encoding="utf-8"?>
31<menu xmlns:android="http://schemas.android.com/apk/res/android">
32 <item
33 android:id="@+id/fragmentA"
34 android:icon="@drawable/ic_home"
35 android:title="" />
36 <item
37 android:id="@+id/fragmentB"
38 android:icon="@drawable/ic_star"
39 android:title="" />
40</menu>
41Am I doing something wrong? or this is bug?
How can I resolve this problem?
ANSWER
Answered 2022-Feb-12 at 06:00Given your navigation graph, there is no way to associate fragmentA2 with your menu item fragmentA, so fragmentA is not selected when you return to fragmentA2. As per this issue:
NavigationUIhas always used the current destination and what graph it is part of as the source of truth for what tab should be selected.This can be seen by calling
navigate()to go to yourSecondFragment- even though you haven't used the bottom nav button, the selected tab was changed because the current destination has changed toR.id.frag_second.So when you
navigate()toR.id.frag_hintvia your button inHomeFragment,NavigationUIreceives a callback that the current destination has changed toR.id.frag_hint. It looks at thatNavDestinationand notes that there's no menu item that matchesR.id.frag_hint. It then looks at the destination's parent graph - yourR.id.sample<navigation>element. There's no menu item that matches that ID either, soNavigationUIcan't associated that destination with any menu item and therefore simply does nothing. That is true on all versions of Navigation.So what is different when you tap on a bottom navigation item? Well, nothing different from a
NavigationUIperspective in fact: the exact same code runs and the current destination and what graph it is part of is the source of truth for what tab should be selected. In the Navigation 2.3.5, there was no state saved for each tab, so it only 'worked' because selecting a tab forced the ID of the current destination to match the destination of the menu item you just tapped.So what you're seeing in your sample app is that there's no link between
R.id.frag_hintand any menu item, which meansNavigationUIdoes nothing. If you want to linkR.id.frag_hintto your Home tab, then that's exactly what a nested navigation graph can be used for.I.e., your navigation graph should instead look like:
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.5.0-alpha01"
5<navigation xmlns:android="http://schemas.android.com/apk/res/android"
6 xmlns:app="http://schemas.android.com/apk/res-auto"
7 xmlns:tools="http://schemas.android.com/tools"
8 android:id="@+id/graph"
9 app:startDestination="@id/fragmentA">
10 <fragment
11 android:id="@+id/fragmentA"
12 android:name="ui.test.FragmentA"
13 tools:layout="@layout/fragment_test"
14 android:label="FragmentA" >
15 <action
16 android:id="@+id/action_fragmentA_to_fragmentA2"
17 app:destination="@id/fragmentA2" />
18 </fragment>
19 <fragment
20 android:id="@+id/fragmentA2"
21 android:name="ui.test.FragmentA2"
22 tools:layout="@layout/fragment_test"
23 android:label="FragmentA2" />
24 <fragment
25 android:id="@+id/fragmentB"
26 android:name="ui.test.FragmentB"
27 tools:layout="@layout/fragment_test"
28 android:label="FragmentB" />
29</navigation>
30<?xml version="1.0" encoding="utf-8"?>
31<menu xmlns:android="http://schemas.android.com/apk/res/android">
32 <item
33 android:id="@+id/fragmentA"
34 android:icon="@drawable/ic_home"
35 android:title="" />
36 <item
37 android:id="@+id/fragmentB"
38 android:icon="@drawable/ic_star"
39 android:title="" />
40</menu>
41<navigation
42 xmlns:android="http://schemas.android.com/apk/res/android"
43 xmlns:app="http://schemas.android.com/apk/res-auto"
44 xmlns:tools="http://schemas.android.com/tools"
45 android:id="@+id/sample"
46 app:startDestination="@id/home">
47
48 <navigation
49 android:id="@+id/home"
50 app:startDestination="@id/frag_home">
51 <fragment
52 android:id="@+id/frag_home"
53 android:name="eu.rekisoft.android.navbug.HomeFragment"
54 tools:layout="@layout/fragment_home">
55 <action
56 android:id="@+id/cause_bug"
57 app:destination="@id/frag_hint"/>
58 </fragment>
59
60 <fragment
61 android:id="@+id/frag_hint"
62 android:name="eu.rekisoft.android.navbug.HintFragment"
63 android:label="Hint"
64 tools:layout="@layout/fragment_hint"/>
65 </navigation>
66
67 <fragment
68 android:id="@+id/frag_second"
69 android:name="eu.rekisoft.android.navbug.SecondFragment"
70 android:label="Second Fragment"
71 tools:layout="@layout/fragment_second"/>
72
73</navigation>
74And your menu XML should be updated to use android:id="@id/home" to match your navigation graph.
Now, when you select the Home bottom nav item, the current destination changes to R.id.frag_hint (as your state was restored due to Navigation 2.4's support for multiple back stacks) and NavigationUI looks at the ID - R.id.frag_hint still doesn't match any menu item, but now the parent graph's ID, R.id.home does match a menu item - your Home menu item, hence, it becomes selected.
The intention that your navigation graph and its structure drives the UI is a key part of how NavigationUI works and is working as intended (there was a bug on earlier versions of Navigation 2.4 that broke this driving principle, but that has since been fixed in beta02). All of NavigationUI is built on public APIs specifically so that if you want to use some different logic for which bottom nav item is selected that is independent from your navigation graph structure, you can absolutely do that.
You'll note from the source code that you can call the public onNavDestinationSelected with your MenuItem to get the exact same navigate() logic which retaining your own ability to return any value from the setOnItemSelectedListener (which is what controls whether the tab becomes selected). Similarly, your own OnDestinationChangedListener can choose to look at the hierarchy of a destination to choose whether to change the selected bottom nav item or not.
So your graphs should also be using nested graphs for each tab:
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.5.0-alpha01"
5<navigation xmlns:android="http://schemas.android.com/apk/res/android"
6 xmlns:app="http://schemas.android.com/apk/res-auto"
7 xmlns:tools="http://schemas.android.com/tools"
8 android:id="@+id/graph"
9 app:startDestination="@id/fragmentA">
10 <fragment
11 android:id="@+id/fragmentA"
12 android:name="ui.test.FragmentA"
13 tools:layout="@layout/fragment_test"
14 android:label="FragmentA" >
15 <action
16 android:id="@+id/action_fragmentA_to_fragmentA2"
17 app:destination="@id/fragmentA2" />
18 </fragment>
19 <fragment
20 android:id="@+id/fragmentA2"
21 android:name="ui.test.FragmentA2"
22 tools:layout="@layout/fragment_test"
23 android:label="FragmentA2" />
24 <fragment
25 android:id="@+id/fragmentB"
26 android:name="ui.test.FragmentB"
27 tools:layout="@layout/fragment_test"
28 android:label="FragmentB" />
29</navigation>
30<?xml version="1.0" encoding="utf-8"?>
31<menu xmlns:android="http://schemas.android.com/apk/res/android">
32 <item
33 android:id="@+id/fragmentA"
34 android:icon="@drawable/ic_home"
35 android:title="" />
36 <item
37 android:id="@+id/fragmentB"
38 android:icon="@drawable/ic_star"
39 android:title="" />
40</menu>
41<navigation
42 xmlns:android="http://schemas.android.com/apk/res/android"
43 xmlns:app="http://schemas.android.com/apk/res-auto"
44 xmlns:tools="http://schemas.android.com/tools"
45 android:id="@+id/sample"
46 app:startDestination="@id/home">
47
48 <navigation
49 android:id="@+id/home"
50 app:startDestination="@id/frag_home">
51 <fragment
52 android:id="@+id/frag_home"
53 android:name="eu.rekisoft.android.navbug.HomeFragment"
54 tools:layout="@layout/fragment_home">
55 <action
56 android:id="@+id/cause_bug"
57 app:destination="@id/frag_hint"/>
58 </fragment>
59
60 <fragment
61 android:id="@+id/frag_hint"
62 android:name="eu.rekisoft.android.navbug.HintFragment"
63 android:label="Hint"
64 tools:layout="@layout/fragment_hint"/>
65 </navigation>
66
67 <fragment
68 android:id="@+id/frag_second"
69 android:name="eu.rekisoft.android.navbug.SecondFragment"
70 android:label="Second Fragment"
71 tools:layout="@layout/fragment_second"/>
72
73</navigation>
74<navigation xmlns:android="http://schemas.android.com/apk/res/android"
75 xmlns:app="http://schemas.android.com/apk/res-auto"
76 xmlns:tools="http://schemas.android.com/tools"
77 android:id="@+id/graph"
78 app:startDestination="@id/graphA">
79 <navigation
80 android:id="@+id/graphA"
81 app:startDestination="@id/fragmentA">
82 <fragment
83 android:id="@+id/fragmentA"
84 android:name="ui.test.FragmentA"
85 tools:layout="@layout/fragment_test"
86 android:label="FragmentA" >
87 <action
88 android:id="@+id/action_fragmentA_to_fragmentA2"
89 app:destination="@id/fragmentA2" />
90 </fragment>
91 <fragment
92 android:id="@+id/fragmentA2"
93 android:name="ui.test.FragmentA2"
94 tools:layout="@layout/fragment_test"
95 android:label="FragmentA2" />
96 </navigation>
97 <navigation
98 android:id="@+id/graphB"
99 app:startDestination="@id/fragmentB">
100 <fragment
101 android:id="@+id/fragmentB"
102 android:name="ui.test.FragmentB"
103 tools:layout="@layout/fragment_test"
104 android:label="FragmentB" />
105 </navigation>
106</navigation>
107Menu:
1implementation "androidx.navigation:navigation-fragment-ktx:2.5.0-alpha01"
2implementation "androidx.navigation:navigation-ui-ktx:2.5.0-alpha01"
3implementation "androidx.navigation:navigation-dynamic-features-fragment:2.5.0-alpha01"
4classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.5.0-alpha01"
5<navigation xmlns:android="http://schemas.android.com/apk/res/android"
6 xmlns:app="http://schemas.android.com/apk/res-auto"
7 xmlns:tools="http://schemas.android.com/tools"
8 android:id="@+id/graph"
9 app:startDestination="@id/fragmentA">
10 <fragment
11 android:id="@+id/fragmentA"
12 android:name="ui.test.FragmentA"
13 tools:layout="@layout/fragment_test"
14 android:label="FragmentA" >
15 <action
16 android:id="@+id/action_fragmentA_to_fragmentA2"
17 app:destination="@id/fragmentA2" />
18 </fragment>
19 <fragment
20 android:id="@+id/fragmentA2"
21 android:name="ui.test.FragmentA2"
22 tools:layout="@layout/fragment_test"
23 android:label="FragmentA2" />
24 <fragment
25 android:id="@+id/fragmentB"
26 android:name="ui.test.FragmentB"
27 tools:layout="@layout/fragment_test"
28 android:label="FragmentB" />
29</navigation>
30<?xml version="1.0" encoding="utf-8"?>
31<menu xmlns:android="http://schemas.android.com/apk/res/android">
32 <item
33 android:id="@+id/fragmentA"
34 android:icon="@drawable/ic_home"
35 android:title="" />
36 <item
37 android:id="@+id/fragmentB"
38 android:icon="@drawable/ic_star"
39 android:title="" />
40</menu>
41<navigation
42 xmlns:android="http://schemas.android.com/apk/res/android"
43 xmlns:app="http://schemas.android.com/apk/res-auto"
44 xmlns:tools="http://schemas.android.com/tools"
45 android:id="@+id/sample"
46 app:startDestination="@id/home">
47
48 <navigation
49 android:id="@+id/home"
50 app:startDestination="@id/frag_home">
51 <fragment
52 android:id="@+id/frag_home"
53 android:name="eu.rekisoft.android.navbug.HomeFragment"
54 tools:layout="@layout/fragment_home">
55 <action
56 android:id="@+id/cause_bug"
57 app:destination="@id/frag_hint"/>
58 </fragment>
59
60 <fragment
61 android:id="@+id/frag_hint"
62 android:name="eu.rekisoft.android.navbug.HintFragment"
63 android:label="Hint"
64 tools:layout="@layout/fragment_hint"/>
65 </navigation>
66
67 <fragment
68 android:id="@+id/frag_second"
69 android:name="eu.rekisoft.android.navbug.SecondFragment"
70 android:label="Second Fragment"
71 tools:layout="@layout/fragment_second"/>
72
73</navigation>
74<navigation xmlns:android="http://schemas.android.com/apk/res/android"
75 xmlns:app="http://schemas.android.com/apk/res-auto"
76 xmlns:tools="http://schemas.android.com/tools"
77 android:id="@+id/graph"
78 app:startDestination="@id/graphA">
79 <navigation
80 android:id="@+id/graphA"
81 app:startDestination="@id/fragmentA">
82 <fragment
83 android:id="@+id/fragmentA"
84 android:name="ui.test.FragmentA"
85 tools:layout="@layout/fragment_test"
86 android:label="FragmentA" >
87 <action
88 android:id="@+id/action_fragmentA_to_fragmentA2"
89 app:destination="@id/fragmentA2" />
90 </fragment>
91 <fragment
92 android:id="@+id/fragmentA2"
93 android:name="ui.test.FragmentA2"
94 tools:layout="@layout/fragment_test"
95 android:label="FragmentA2" />
96 </navigation>
97 <navigation
98 android:id="@+id/graphB"
99 app:startDestination="@id/fragmentB">
100 <fragment
101 android:id="@+id/fragmentB"
102 android:name="ui.test.FragmentB"
103 tools:layout="@layout/fragment_test"
104 android:label="FragmentB" />
105 </navigation>
106</navigation>
107<?xml version="1.0" encoding="utf-8"?>
108<menu xmlns:android="http://schemas.android.com/apk/res/android">
109 <item
110 android:id="@+id/graphA"
111 android:icon="@drawable/ic_home"
112 android:title="" />
113 <item
114 android:id="@+id/graphB"
115 android:icon="@drawable/ic_star"
116 android:title="" />
117</menu>
118QUESTION
Fixing Cluttered Titles on Graphs
Asked 2022-Mar-07 at 19:08I made the following 25 network graphs (all of these graphs are copies for simplicity - in reality, they will all be different):
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38I would like to "tile" them as 5 x 5 : Since these are interactive html plots - I used the following command:
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38library(manipulateWidget)
39library(htmltools)
40
41ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
42
43htmltools::save_html(html = ff, file = "widgets.html")
44I found out how to add a zoom option for each individual graph:
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38library(manipulateWidget)
39library(htmltools)
40
41ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
42
43htmltools::save_html(html = ff, file = "widgets.html")
44 a = toVisNetworkData(graph) %>%
45 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
46 do.call(visNetwork, .) %>%
47 visIgraphLayout(layout = "layout_in_circle") %>%
48 visInteraction(navigationButtons = TRUE) %>%
49 visEdges(arrows = 'to')
50
51y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
52
53ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
54
55htmltools::save_html(html = ff, file = "widgets.html")
56
But now the "zoom" options and "titles" have "cluttered" all the graphs!
I was thinking it might be better to "stack" all these graphs on top of each other and save each graph as a "group type" - and then hide/unhide as we please:
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38library(manipulateWidget)
39library(htmltools)
40
41ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
42
43htmltools::save_html(html = ff, file = "widgets.html")
44 a = toVisNetworkData(graph) %>%
45 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
46 do.call(visNetwork, .) %>%
47 visIgraphLayout(layout = "layout_in_circle") %>%
48 visInteraction(navigationButtons = TRUE) %>%
49 visEdges(arrows = 'to')
50
51y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
52
53ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
54
55htmltools::save_html(html = ff, file = "widgets.html")
56visNetwork(data, relations) %>%
57 visOptions(selectedBy = "group")
58Can we put all 25 graphs on one page and then "zoom" into each individual graph to view it better (e.g. have only one set of zoom/navigation buttons in the corner of the screen that works for all graphs)?
Is there a way to stop the titles from overlapping with the graphs?
Can we put all 25 graphs on one page and then "hide" individual graphs by "checking" an option menu button? (like the last example on this page: https://datastorm-open.github.io/visNetwork/options.html)
Here are the possible solutions I have thought of for this problem:
- Option 1: (a single zoom/navigation option for all graphs and no cluttered labels)
- Option 2: (In the future, each "trip" will be different - "trips" will contain the same nodes, but have different edge connections and different titles/subtitles.)
I know that this style of selection ("Option 2") can be made using the following code:
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38library(manipulateWidget)
39library(htmltools)
40
41ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
42
43htmltools::save_html(html = ff, file = "widgets.html")
44 a = toVisNetworkData(graph) %>%
45 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
46 do.call(visNetwork, .) %>%
47 visIgraphLayout(layout = "layout_in_circle") %>%
48 visInteraction(navigationButtons = TRUE) %>%
49 visEdges(arrows = 'to')
50
51y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
52
53ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
54
55htmltools::save_html(html = ff, file = "widgets.html")
56visNetwork(data, relations) %>%
57 visOptions(selectedBy = "group")
58nodes <- data.frame(id = 1:15, label = paste("Label", 1:15),
59 group = sample(LETTERS[1:3], 15, replace = TRUE))
60
61edges <- data.frame(from = trunc(runif(15)*(15-1))+1,
62 to = trunc(runif(15)*(15-1))+1)
63
64
65
66visNetwork(nodes, edges) %>%
67 visOptions(selectedBy = "group")
68But I am not sure how to adapt the above code for a pre-existing set of "visNetwork" graphs. For example, suppose I already have "visNetwork" graphs "a, b, c, d, e" - how can I "stack them on top of each other" and "shuffle through them" with a "select menu" like in the above code?
Can someone please show me a way of addressing this clutter problem using Option 1 and Option 2?
Thank you!
ANSWER
Answered 2022-Mar-03 at 21:12While my solution isn't exactly what you describe under Option 2, it is close. We use combineWidgets() to create a grid with a single column and a row height where one graph covers most of the screen height. We squeeze in a link between each widget instance that scrolls the browser window down to show the following graph when clicked.
Let me know if this is working for you. It should be possible to automatically adjust the row size according to the browser window size. Currently, this depends on the browser window height being around 1000px.
I modified your code for the graph creation slightly and wrapped it in a function. This allows us to create 25 different-looking graphs easily. This way testing the resulting HTML file is more fun! What follows the function definition is the code to create a list of HTML objects that we then feed into combineWidgets().
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38library(manipulateWidget)
39library(htmltools)
40
41ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
42
43htmltools::save_html(html = ff, file = "widgets.html")
44 a = toVisNetworkData(graph) %>%
45 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
46 do.call(visNetwork, .) %>%
47 visIgraphLayout(layout = "layout_in_circle") %>%
48 visInteraction(navigationButtons = TRUE) %>%
49 visEdges(arrows = 'to')
50
51y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
52
53ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
54
55htmltools::save_html(html = ff, file = "widgets.html")
56visNetwork(data, relations) %>%
57 visOptions(selectedBy = "group")
58nodes <- data.frame(id = 1:15, label = paste("Label", 1:15),
59 group = sample(LETTERS[1:3], 15, replace = TRUE))
60
61edges <- data.frame(from = trunc(runif(15)*(15-1))+1,
62 to = trunc(runif(15)*(15-1))+1)
63
64
65
66visNetwork(nodes, edges) %>%
67 visOptions(selectedBy = "group")
68library(visNetwork)
69library(tidyverse)
70library(igraph)
71library(manipulateWidget)
72library(htmltools)
73
74create_trip_graph <-
75 function(x, distance = NULL) {
76 n <- 15
77 data <- tibble(d = 1:n,
78 name =
79 c(
80 "new york",
81 "chicago",
82 "los angeles",
83 "orlando",
84 "houston",
85 "seattle",
86 "washington",
87 "baltimore",
88 "atlanta",
89 "las vegas",
90 "oakland",
91 "phoenix",
92 "kansas",
93 "miami",
94 "newark"
95 ))
96
97 relations <- tibble(from = sample(data$d),
98 to = lead(from, default = from[1]))
99 graph <-
100 graph_from_data_frame(relations, directed = TRUE, vertices = data)
101
102 V(graph)$color <-
103 ifelse(data$d == relations$from[1], "red", "orange")
104
105 if (is.null(distance))
106 # This generates a random distance value if none is
107 # specified in the function call. Values are just for
108 # demonstration, no actual distances are calculated.
109 distance <- sample(seq(19, 25, .1), 1)
110
111 toVisNetworkData(graph) %>%
112 c(., list(
113 main = paste0("Trip ", x, " : "),
114 submain = paste0(distance, "KM")
115 )) %>%
116 do.call(visNetwork, .) %>%
117 visIgraphLayout(layout = "layout_in_circle") %>%
118 visInteraction(navigationButtons = TRUE) %>%
119 visEdges(arrows = 'to')
120 }
121
122comb_vgraphs <- lapply(1:25, function (x) list(
123 create_trip_graph(x),
124 htmltools::a("NEXT TRIP",
125 onclick = 'window.scrollBy(0,950)',
126 style = 'color:blue; text-decoration:underline;'))) %>%
127 unlist(recursive = FALSE)
128
129
130ff <-
131 combineWidgets(
132 list = comb_vgraphs,
133 ncol = 1,
134 height = 25 * 950,
135 rowsize = c(24, 1)
136 )
137
138htmltools::save_html(html = ff, file = "widgets.html")
139If you want to have 5 network maps per row the code gets a bit more complex and it also might lead to a situation where the user might have to do horizontal scrolling in order to see everything, which is something you usually want to avoid when creating HTML pages. Here is the code for a 5 maps per row solution:
1library(tidyverse)
2library(igraph)
3
4
5set.seed(123)
6n=15
7data = data.frame(tibble(d = paste(1:n)))
8
9relations = data.frame(tibble(
10 from = sample(data$d),
11 to = lead(from, default=from[1]),
12))
13
14data$name = c("new york", "chicago", "los angeles", "orlando", "houston", "seattle", "washington", "baltimore", "atlanta", "las vegas", "oakland", "phoenix", "kansas", "miami", "newark" )
15
16graph = graph_from_data_frame(relations, directed=T, vertices = data)
17
18V(graph)$color <- ifelse(data$d == relations$from[1], "red", "orange")
19
20plot(graph, layout=layout.circle, edge.arrow.size = 0.2, main = "my_graph")
21
22library(visNetwork)
23
24 a = visIgraph(graph)
25
26m_1 = 1
27m_2 = 23.6
28
29 a = toVisNetworkData(graph) %>%
30 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
31 do.call(visNetwork, .) %>%
32 visIgraphLayout(layout = "layout_in_circle") %>%
33 visEdges(arrows = 'to')
34
35
36
37y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
38library(manipulateWidget)
39library(htmltools)
40
41ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
42
43htmltools::save_html(html = ff, file = "widgets.html")
44 a = toVisNetworkData(graph) %>%
45 c(., list(main = paste0("Trip ", m_1, " : "), submain = paste0 (m_2, "KM") )) %>%
46 do.call(visNetwork, .) %>%
47 visIgraphLayout(layout = "layout_in_circle") %>%
48 visInteraction(navigationButtons = TRUE) %>%
49 visEdges(arrows = 'to')
50
51y = x = w = v = u = t = s = r = q = p = o = n = m = l = k = j = i = h = g = f = e = d = c = b = a
52
53ff = combineWidgets(y , x , w , v , u , t , s , r , q , p , o , n , m , l , k , j , i , h , g , f , e , d , c , b , a)
54
55htmltools::save_html(html = ff, file = "widgets.html")
56visNetwork(data, relations) %>%
57 visOptions(selectedBy = "group")
58nodes <- data.frame(id = 1:15, label = paste("Label", 1:15),
59 group = sample(LETTERS[1:3], 15, replace = TRUE))
60
61edges <- data.frame(from = trunc(runif(15)*(15-1))+1,
62 to = trunc(runif(15)*(15-1))+1)
63
64
65
66visNetwork(nodes, edges) %>%
67 visOptions(selectedBy = "group")
68library(visNetwork)
69library(tidyverse)
70library(igraph)
71library(manipulateWidget)
72library(htmltools)
73
74create_trip_graph <-
75 function(x, distance = NULL) {
76 n <- 15
77 data <- tibble(d = 1:n,
78 name =
79 c(
80 "new york",
81 "chicago",
82 "los angeles",
83 "orlando",
84 "houston",
85 "seattle",
86 "washington",
87 "baltimore",
88 "atlanta",
89 "las vegas",
90 "oakland",
91 "phoenix",
92 "kansas",
93 "miami",
94 "newark"
95 ))
96
97 relations <- tibble(from = sample(data$d),
98 to = lead(from, default = from[1]))
99 graph <-
100 graph_from_data_frame(relations, directed = TRUE, vertices = data)
101
102 V(graph)$color <-
103 ifelse(data$d == relations$from[1], "red", "orange")
104
105 if (is.null(distance))
106 # This generates a random distance value if none is
107 # specified in the function call. Values are just for
108 # demonstration, no actual distances are calculated.
109 distance <- sample(seq(19, 25, .1), 1)
110
111 toVisNetworkData(graph) %>%
112 c(., list(
113 main = paste0("Trip ", x, " : "),
114 submain = paste0(distance, "KM")
115 )) %>%
116 do.call(visNetwork, .) %>%
117 visIgraphLayout(layout = "layout_in_circle") %>%
118 visInteraction(navigationButtons = TRUE) %>%
119 visEdges(arrows = 'to')
120 }
121
122comb_vgraphs <- lapply(1:25, function (x) list(
123 create_trip_graph(x),
124 htmltools::a("NEXT TRIP",
125 onclick = 'window.scrollBy(0,950)',
126 style = 'color:blue; text-decoration:underline;'))) %>%
127 unlist(recursive = FALSE)
128
129
130ff <-
131 combineWidgets(
132 list = comb_vgraphs,
133 ncol = 1,
134 height = 25 * 950,
135 rowsize = c(24, 1)
136 )
137
138htmltools::save_html(html = ff, file = "widgets.html")
139comb_vgraphs2 <- lapply(1:25, function(x) {
140 a <- list(create_trip_graph(x))
141 # We detect whenever we are creating the 5th, 10th, 15th etc. network map
142 # and add the link after that one.
143 if (x %% 5 == 0 & x < 25) a[[2]] <- htmltools::a("NEXT 5 TRIPS",
144 onclick = 'window.scrollBy(0,500)',
145 style = 'color:blue; text-decoration:underline;')
146 a
147}) %>%
148 unlist(recursive = FALSE)
149
150ff2 <-
151 combineWidgets(
152 list = comb_vgraphs2,
153 ncol = 6, # We need six columns, 5 for the network maps
154 # and 1 for the link to scroll the page.
155 height = 6 * 500,
156 width = 1700
157 #rowsize = c(24, 1)
158 )
159
160# We need to add some white space in for the scrolling by clicking the link to
161# still work for the last row.
162ff2$widgets[[length(ff2$widgets) + 1]] <- htmltools::div(style = "height: 1000px;")
163
164htmltools::save_html(html = ff2, file = "widgets2.html")
165In general I'd recommend you play around with the height and width, ncol and nrow arguments of combineWidgets() to achieve a satisfying solution. My strategy when building this was to first create a grid without the scroll link and add that in, after getting the grid right.
QUESTION
java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest;
Asked 2022-Feb-25 at 23:22It was working fine before I have done nothing, no packages update, no gradle update no nothing just created new build and this error occurs. but for some team members the error occur after gradle sync.
The issue is that build is generating successfully without any error but when opens the app it suddenly gets crash (in both debug and release mode)
Error
1 E/AndroidRuntime: FATAL EXCEPTION: AsyncTask #3
2 java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest; or its super classes (declaration of 'com.facebook.GraphRequest' appears in /data/app/~~aLf3pfLySq5u7zpIAr2Hlg==/com.package-name-99h4GcP3GNx2sMs76AXGvA==/base.apk)
3 at com.facebook.marketing.internal.RemoteConfigManager.getRemoteConfigQueryResponse(RemoteConfigManager.java:87)
4 at com.facebook.marketing.internal.RemoteConfigManager.access$000(RemoteConfigManager.java:43)
5 at com.facebook.marketing.internal.RemoteConfigManager$1.run(RemoteConfigManager.java:64)
6 at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
7 at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
8 at java.lang.Thread.run(Thread.java:923)
9gradle-wrapper.properties
1 E/AndroidRuntime: FATAL EXCEPTION: AsyncTask #3
2 java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest; or its super classes (declaration of 'com.facebook.GraphRequest' appears in /data/app/~~aLf3pfLySq5u7zpIAr2Hlg==/com.package-name-99h4GcP3GNx2sMs76AXGvA==/base.apk)
3 at com.facebook.marketing.internal.RemoteConfigManager.getRemoteConfigQueryResponse(RemoteConfigManager.java:87)
4 at com.facebook.marketing.internal.RemoteConfigManager.access$000(RemoteConfigManager.java:43)
5 at com.facebook.marketing.internal.RemoteConfigManager$1.run(RemoteConfigManager.java:64)
6 at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
7 at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
8 at java.lang.Thread.run(Thread.java:923)
9distributionBase=GRADLE_USER_HOME
10distributionPath=wrapper/dists
11distributionUrl=https\://services.gradle.org/distributions/gradle-6.9-all.zip
12zipStoreBase=GRADLE_USER_HOME
13zipStorePath=wrapper/dists
14build.gradle
1 E/AndroidRuntime: FATAL EXCEPTION: AsyncTask #3
2 java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest; or its super classes (declaration of 'com.facebook.GraphRequest' appears in /data/app/~~aLf3pfLySq5u7zpIAr2Hlg==/com.package-name-99h4GcP3GNx2sMs76AXGvA==/base.apk)
3 at com.facebook.marketing.internal.RemoteConfigManager.getRemoteConfigQueryResponse(RemoteConfigManager.java:87)
4 at com.facebook.marketing.internal.RemoteConfigManager.access$000(RemoteConfigManager.java:43)
5 at com.facebook.marketing.internal.RemoteConfigManager$1.run(RemoteConfigManager.java:64)
6 at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
7 at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
8 at java.lang.Thread.run(Thread.java:923)
9distributionBase=GRADLE_USER_HOME
10distributionPath=wrapper/dists
11distributionUrl=https\://services.gradle.org/distributions/gradle-6.9-all.zip
12zipStoreBase=GRADLE_USER_HOME
13zipStorePath=wrapper/dists
14// Top-level build file where you can add configuration options common to all sub-projects/modules.
15
16buildscript {
17 ext {
18 buildToolsVersion = "30.0.2"
19 minSdkVersion = 21
20 compileSdkVersion = 30
21 targetSdkVersion = 30
22 ndkVersion = "21.4.7075529"
23 }
24 repositories {
25 google()
26 mavenCentral()
27 jcenter()
28 // maven {
29 // url 'https://maven.fabric.io/public'
30 // }
31 maven { url "https://www.jitpack.io" }
32 }
33 dependencies {
34 classpath("com.android.tools.build:gradle:4.2.2")
35 classpath 'com.google.gms:google-services:4.2.0' // Google Services plugin
36 // Add the Fabric Crashlytics plugin.
37 // classpath 'io.fabric.tools:gradle:1.31.2'
38 // firebase performance sdk
39 classpath 'com.google.firebase:perf-plugin:1.4.0'
40 classpath 'com.google.firebase:firebase-crashlytics-gradle:2.7.1'
41
42
43 // NOTE: Do not place your application dependencies here; they belong
44 // in the individual module build.gradle files
45 }
46}
47
48allprojects {
49 repositories {
50 mavenCentral()
51 mavenLocal()
52 maven {
53 // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
54 url("$rootDir/../node_modules/react-native/android")
55 }
56 maven {
57 // Android JSC is installed from npm
58 url("$rootDir/../node_modules/jsc-android/dist")
59 }
60
61 google()
62 jcenter()
63 maven { url 'https://www.jitpack.io' }
64 }
65}
66
67
68subprojects {
69 afterEvaluate {project ->
70 if (project.hasProperty("android")) {
71 android {
72 buildToolsVersion "28.0.3"
73 compileSdkVersion 28
74 }
75 }
76 }
77}
78
79subprojects {
80 afterEvaluate {project ->
81 if (project.hasProperty("android")) {
82 android {
83 compileSdkVersion 29
84 buildToolsVersion '29.0.3'
85 }
86 }
87 }
88}
89packages
1 E/AndroidRuntime: FATAL EXCEPTION: AsyncTask #3
2 java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest; or its super classes (declaration of 'com.facebook.GraphRequest' appears in /data/app/~~aLf3pfLySq5u7zpIAr2Hlg==/com.package-name-99h4GcP3GNx2sMs76AXGvA==/base.apk)
3 at com.facebook.marketing.internal.RemoteConfigManager.getRemoteConfigQueryResponse(RemoteConfigManager.java:87)
4 at com.facebook.marketing.internal.RemoteConfigManager.access$000(RemoteConfigManager.java:43)
5 at com.facebook.marketing.internal.RemoteConfigManager$1.run(RemoteConfigManager.java:64)
6 at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
7 at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
8 at java.lang.Thread.run(Thread.java:923)
9distributionBase=GRADLE_USER_HOME
10distributionPath=wrapper/dists
11distributionUrl=https\://services.gradle.org/distributions/gradle-6.9-all.zip
12zipStoreBase=GRADLE_USER_HOME
13zipStorePath=wrapper/dists
14// Top-level build file where you can add configuration options common to all sub-projects/modules.
15
16buildscript {
17 ext {
18 buildToolsVersion = "30.0.2"
19 minSdkVersion = 21
20 compileSdkVersion = 30
21 targetSdkVersion = 30
22 ndkVersion = "21.4.7075529"
23 }
24 repositories {
25 google()
26 mavenCentral()
27 jcenter()
28 // maven {
29 // url 'https://maven.fabric.io/public'
30 // }
31 maven { url "https://www.jitpack.io" }
32 }
33 dependencies {
34 classpath("com.android.tools.build:gradle:4.2.2")
35 classpath 'com.google.gms:google-services:4.2.0' // Google Services plugin
36 // Add the Fabric Crashlytics plugin.
37 // classpath 'io.fabric.tools:gradle:1.31.2'
38 // firebase performance sdk
39 classpath 'com.google.firebase:perf-plugin:1.4.0'
40 classpath 'com.google.firebase:firebase-crashlytics-gradle:2.7.1'
41
42
43 // NOTE: Do not place your application dependencies here; they belong
44 // in the individual module build.gradle files
45 }
46}
47
48allprojects {
49 repositories {
50 mavenCentral()
51 mavenLocal()
52 maven {
53 // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
54 url("$rootDir/../node_modules/react-native/android")
55 }
56 maven {
57 // Android JSC is installed from npm
58 url("$rootDir/../node_modules/jsc-android/dist")
59 }
60
61 google()
62 jcenter()
63 maven { url 'https://www.jitpack.io' }
64 }
65}
66
67
68subprojects {
69 afterEvaluate {project ->
70 if (project.hasProperty("android")) {
71 android {
72 buildToolsVersion "28.0.3"
73 compileSdkVersion 28
74 }
75 }
76 }
77}
78
79subprojects {
80 afterEvaluate {project ->
81 if (project.hasProperty("android")) {
82 android {
83 compileSdkVersion 29
84 buildToolsVersion '29.0.3'
85 }
86 }
87 }
88}
89"dependencies": {
90 "@eva-design/eva": "^2.1.0",
91 "@react-native-async-storage/async-storage": "^1.15.14",
92 "@react-native-community/blur": "^3.6.0",
93 "@react-native-community/checkbox": "^0.5.0",
94 "@react-native-community/netinfo": "^6.0.1",
95 "@react-native-community/toolbar-android": "^0.1.0-rc.2",
96 "@react-native-firebase/analytics": "^10.3.1",
97 "@react-native-firebase/app": "^10.3.0",
98 "@react-native-firebase/auth": "^10.3.1",
99 "@react-native-firebase/crashlytics": "^10.3.1",
100 "@react-native-firebase/dynamic-links": "^10.3.1",
101 "@react-native-firebase/firestore": "^10.3.1",
102 "@react-native-firebase/iid": "^10.3.1",
103 "@react-native-firebase/in-app-messaging": "^10.3.1",
104 "@react-native-firebase/messaging": "^10.3.1",
105 "@react-native-firebase/perf": "^10.3.1",
106 "@react-native-firebase/remote-config": "^10.3.1",
107 "@react-native-firebase/storage": "^10.3.1",
108 "@react-native-picker/picker": "^2.1.0",
109 "@react-navigation/bottom-tabs": "^6.0.9",
110 "@react-navigation/native": "^6.0.6",
111 "@react-navigation/stack": "^6.0.11",
112 "@types/react-native": "^0.65.5",
113 "@ui-kitten/components": "^5.1.0",
114 "axios": "^0.19.0",
115 "i18n-js": "^3.5.1",
116 "moment": "^2.24.0",
117 "native-base": "2.13.8",
118 "react": "17.0.2",
119 "react-content-loader": "^4.3.4",
120 "react-native": "0.66.0",
121 "react-native-actions-sheet": "^0.5.6",
122 "react-native-adjust": "^4.28.0",
123 "react-native-amplitude-analytics": "^0.2.7",
124 "react-native-animatable": "^1.3.3",
125 "react-native-code-push": "^7.0.4",
126 "react-native-config": "^1.3.3",
127 "react-native-contacts": "^5.0.7",
128 "react-native-dots-pagination": "^0.2.0",
129 "react-native-fbsdk-next": "^6.2.0",
130 "react-native-fingerprint-scanner": "^6.0.0",
131 "react-native-floating-action": "^1.22.0",
132 "react-native-geocoding": "^0.4.0",
133 "react-native-geolocation-service": "^5.2.0",
134 "react-native-gesture-handler": "^1.5.2",
135 "react-native-get-random-values": "^1.4.0",
136 "react-native-html-to-pdf-lite": "^0.11.0",
137 "react-native-image-base64": "^0.1.4",
138 "react-native-image-pan-zoom": "^2.1.11",
139 "react-native-image-picker": "^4.1.2",
140 "react-native-image-resizer": "^1.2.0",
141 "react-native-in-app-review": "^2.1.7",
142 "react-native-linear-gradient": "^2.5.6",
143 "react-native-loading-spinner-overlay": "^1.1.0",
144 "react-native-material-menu": "^1.0.0",
145 "react-native-material-textfield": "^0.16.1",
146 "react-native-modal": "^13.0.0",
147 "react-native-phone-call": "^1.0.9",
148 "react-native-ratings": "^7.3.0",
149 "react-native-reanimated": "^1.13.0",
150 "react-native-safe-area-context": "^3.3.2",
151 "react-native-screens": "^3.9.0",
152 "react-native-share": "^7.2.1",
153 "react-native-smooth-pincode-input": "^1.0.9",
154 "react-native-sms-retriever": "https://github.com/sarmad1995/react-native-sms-retriever.git",
155 "react-native-snap-carousel": "^3.9.1",
156 "react-native-splash-screen": "^3.2.0",
157 "react-native-svg": "^12.1.1",
158 "react-native-version-check": "^3.4.2",
159 "react-native-version-number": "^0.3.6",
160 "react-native-view-shot": "^3.1.2",
161 "react-native-walkthrough-tooltip": "^1.3.0",
162 "react-redux": "^7.1.3",
163 "redux": "^4.0.4",
164 "redux-logger": "^3.0.6",
165 "redux-persist": "^6.0.0",
166 "redux-thunk": "^2.3.0",
167 "rn-fetch-blob": "^0.12.0",
168 "urbanairship-react-native": "^12.0.0",
169 "uuid": "^8.3.0"
170},
171ANSWER
Answered 2022-Feb-25 at 23:22We have fixed the issue by replacing
1 E/AndroidRuntime: FATAL EXCEPTION: AsyncTask #3
2 java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest; or its super classes (declaration of 'com.facebook.GraphRequest' appears in /data/app/~~aLf3pfLySq5u7zpIAr2Hlg==/com.package-name-99h4GcP3GNx2sMs76AXGvA==/base.apk)
3 at com.facebook.marketing.internal.RemoteConfigManager.getRemoteConfigQueryResponse(RemoteConfigManager.java:87)
4 at com.facebook.marketing.internal.RemoteConfigManager.access$000(RemoteConfigManager.java:43)
5 at com.facebook.marketing.internal.RemoteConfigManager$1.run(RemoteConfigManager.java:64)
6 at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
7 at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
8 at java.lang.Thread.run(Thread.java:923)
9distributionBase=GRADLE_USER_HOME
10distributionPath=wrapper/dists
11distributionUrl=https\://services.gradle.org/distributions/gradle-6.9-all.zip
12zipStoreBase=GRADLE_USER_HOME
13zipStorePath=wrapper/dists
14// Top-level build file where you can add configuration options common to all sub-projects/modules.
15
16buildscript {
17 ext {
18 buildToolsVersion = "30.0.2"
19 minSdkVersion = 21
20 compileSdkVersion = 30
21 targetSdkVersion = 30
22 ndkVersion = "21.4.7075529"
23 }
24 repositories {
25 google()
26 mavenCentral()
27 jcenter()
28 // maven {
29 // url 'https://maven.fabric.io/public'
30 // }
31 maven { url "https://www.jitpack.io" }
32 }
33 dependencies {
34 classpath("com.android.tools.build:gradle:4.2.2")
35 classpath 'com.google.gms:google-services:4.2.0' // Google Services plugin
36 // Add the Fabric Crashlytics plugin.
37 // classpath 'io.fabric.tools:gradle:1.31.2'
38 // firebase performance sdk
39 classpath 'com.google.firebase:perf-plugin:1.4.0'
40 classpath 'com.google.firebase:firebase-crashlytics-gradle:2.7.1'
41
42
43 // NOTE: Do not place your application dependencies here; they belong
44 // in the individual module build.gradle files
45 }
46}
47
48allprojects {
49 repositories {
50 mavenCentral()
51 mavenLocal()
52 maven {
53 // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
54 url("$rootDir/../node_modules/react-native/android")
55 }
56 maven {
57 // Android JSC is installed from npm
58 url("$rootDir/../node_modules/jsc-android/dist")
59 }
60
61 google()
62 jcenter()
63 maven { url 'https://www.jitpack.io' }
64 }
65}
66
67
68subprojects {
69 afterEvaluate {project ->
70 if (project.hasProperty("android")) {
71 android {
72 buildToolsVersion "28.0.3"
73 compileSdkVersion 28
74 }
75 }
76 }
77}
78
79subprojects {
80 afterEvaluate {project ->
81 if (project.hasProperty("android")) {
82 android {
83 compileSdkVersion 29
84 buildToolsVersion '29.0.3'
85 }
86 }
87 }
88}
89"dependencies": {
90 "@eva-design/eva": "^2.1.0",
91 "@react-native-async-storage/async-storage": "^1.15.14",
92 "@react-native-community/blur": "^3.6.0",
93 "@react-native-community/checkbox": "^0.5.0",
94 "@react-native-community/netinfo": "^6.0.1",
95 "@react-native-community/toolbar-android": "^0.1.0-rc.2",
96 "@react-native-firebase/analytics": "^10.3.1",
97 "@react-native-firebase/app": "^10.3.0",
98 "@react-native-firebase/auth": "^10.3.1",
99 "@react-native-firebase/crashlytics": "^10.3.1",
100 "@react-native-firebase/dynamic-links": "^10.3.1",
101 "@react-native-firebase/firestore": "^10.3.1",
102 "@react-native-firebase/iid": "^10.3.1",
103 "@react-native-firebase/in-app-messaging": "^10.3.1",
104 "@react-native-firebase/messaging": "^10.3.1",
105 "@react-native-firebase/perf": "^10.3.1",
106 "@react-native-firebase/remote-config": "^10.3.1",
107 "@react-native-firebase/storage": "^10.3.1",
108 "@react-native-picker/picker": "^2.1.0",
109 "@react-navigation/bottom-tabs": "^6.0.9",
110 "@react-navigation/native": "^6.0.6",
111 "@react-navigation/stack": "^6.0.11",
112 "@types/react-native": "^0.65.5",
113 "@ui-kitten/components": "^5.1.0",
114 "axios": "^0.19.0",
115 "i18n-js": "^3.5.1",
116 "moment": "^2.24.0",
117 "native-base": "2.13.8",
118 "react": "17.0.2",
119 "react-content-loader": "^4.3.4",
120 "react-native": "0.66.0",
121 "react-native-actions-sheet": "^0.5.6",
122 "react-native-adjust": "^4.28.0",
123 "react-native-amplitude-analytics": "^0.2.7",
124 "react-native-animatable": "^1.3.3",
125 "react-native-code-push": "^7.0.4",
126 "react-native-config": "^1.3.3",
127 "react-native-contacts": "^5.0.7",
128 "react-native-dots-pagination": "^0.2.0",
129 "react-native-fbsdk-next": "^6.2.0",
130 "react-native-fingerprint-scanner": "^6.0.0",
131 "react-native-floating-action": "^1.22.0",
132 "react-native-geocoding": "^0.4.0",
133 "react-native-geolocation-service": "^5.2.0",
134 "react-native-gesture-handler": "^1.5.2",
135 "react-native-get-random-values": "^1.4.0",
136 "react-native-html-to-pdf-lite": "^0.11.0",
137 "react-native-image-base64": "^0.1.4",
138 "react-native-image-pan-zoom": "^2.1.11",
139 "react-native-image-picker": "^4.1.2",
140 "react-native-image-resizer": "^1.2.0",
141 "react-native-in-app-review": "^2.1.7",
142 "react-native-linear-gradient": "^2.5.6",
143 "react-native-loading-spinner-overlay": "^1.1.0",
144 "react-native-material-menu": "^1.0.0",
145 "react-native-material-textfield": "^0.16.1",
146 "react-native-modal": "^13.0.0",
147 "react-native-phone-call": "^1.0.9",
148 "react-native-ratings": "^7.3.0",
149 "react-native-reanimated": "^1.13.0",
150 "react-native-safe-area-context": "^3.3.2",
151 "react-native-screens": "^3.9.0",
152 "react-native-share": "^7.2.1",
153 "react-native-smooth-pincode-input": "^1.0.9",
154 "react-native-sms-retriever": "https://github.com/sarmad1995/react-native-sms-retriever.git",
155 "react-native-snap-carousel": "^3.9.1",
156 "react-native-splash-screen": "^3.2.0",
157 "react-native-svg": "^12.1.1",
158 "react-native-version-check": "^3.4.2",
159 "react-native-version-number": "^0.3.6",
160 "react-native-view-shot": "^3.1.2",
161 "react-native-walkthrough-tooltip": "^1.3.0",
162 "react-redux": "^7.1.3",
163 "redux": "^4.0.4",
164 "redux-logger": "^3.0.6",
165 "redux-persist": "^6.0.0",
166 "redux-thunk": "^2.3.0",
167 "rn-fetch-blob": "^0.12.0",
168 "urbanairship-react-native": "^12.0.0",
169 "uuid": "^8.3.0"
170},
171implementation 'com.facebook.android:facebook-marketing:[4,5)'
172by
1 E/AndroidRuntime: FATAL EXCEPTION: AsyncTask #3
2 java.lang.NoSuchMethodError: No virtual method setSkipClientToken(Z)V in class Lcom/facebook/GraphRequest; or its super classes (declaration of 'com.facebook.GraphRequest' appears in /data/app/~~aLf3pfLySq5u7zpIAr2Hlg==/com.package-name-99h4GcP3GNx2sMs76AXGvA==/base.apk)
3 at com.facebook.marketing.internal.RemoteConfigManager.getRemoteConfigQueryResponse(RemoteConfigManager.java:87)
4 at com.facebook.marketing.internal.RemoteConfigManager.access$000(RemoteConfigManager.java:43)
5 at com.facebook.marketing.internal.RemoteConfigManager$1.run(RemoteConfigManager.java:64)
6 at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
7 at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
8 at java.lang.Thread.run(Thread.java:923)
9distributionBase=GRADLE_USER_HOME
10distributionPath=wrapper/dists
11distributionUrl=https\://services.gradle.org/distributions/gradle-6.9-all.zip
12zipStoreBase=GRADLE_USER_HOME
13zipStorePath=wrapper/dists
14// Top-level build file where you can add configuration options common to all sub-projects/modules.
15
16buildscript {
17 ext {
18 buildToolsVersion = "30.0.2"
19 minSdkVersion = 21
20 compileSdkVersion = 30
21 targetSdkVersion = 30
22 ndkVersion = "21.4.7075529"
23 }
24 repositories {
25 google()
26 mavenCentral()
27 jcenter()
28 // maven {
29 // url 'https://maven.fabric.io/public'
30 // }
31 maven { url "https://www.jitpack.io" }
32 }
33 dependencies {
34 classpath("com.android.tools.build:gradle:4.2.2")
35 classpath 'com.google.gms:google-services:4.2.0' // Google Services plugin
36 // Add the Fabric Crashlytics plugin.
37 // classpath 'io.fabric.tools:gradle:1.31.2'
38 // firebase performance sdk
39 classpath 'com.google.firebase:perf-plugin:1.4.0'
40 classpath 'com.google.firebase:firebase-crashlytics-gradle:2.7.1'
41
42
43 // NOTE: Do not place your application dependencies here; they belong
44 // in the individual module build.gradle files
45 }
46}
47
48allprojects {
49 repositories {
50 mavenCentral()
51 mavenLocal()
52 maven {
53 // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
54 url("$rootDir/../node_modules/react-native/android")
55 }
56 maven {
57 // Android JSC is installed from npm
58 url("$rootDir/../node_modules/jsc-android/dist")
59 }
60
61 google()
62 jcenter()
63 maven { url 'https://www.jitpack.io' }
64 }
65}
66
67
68subprojects {
69 afterEvaluate {project ->
70 if (project.hasProperty("android")) {
71 android {
72 buildToolsVersion "28.0.3"
73 compileSdkVersion 28
74 }
75 }
76 }
77}
78
79subprojects {
80 afterEvaluate {project ->
81 if (project.hasProperty("android")) {
82 android {
83 compileSdkVersion 29
84 buildToolsVersion '29.0.3'
85 }
86 }
87 }
88}
89"dependencies": {
90 "@eva-design/eva": "^2.1.0",
91 "@react-native-async-storage/async-storage": "^1.15.14",
92 "@react-native-community/blur": "^3.6.0",
93 "@react-native-community/checkbox": "^0.5.0",
94 "@react-native-community/netinfo": "^6.0.1",
95 "@react-native-community/toolbar-android": "^0.1.0-rc.2",
96 "@react-native-firebase/analytics": "^10.3.1",
97 "@react-native-firebase/app": "^10.3.0",
98 "@react-native-firebase/auth": "^10.3.1",
99 "@react-native-firebase/crashlytics": "^10.3.1",
100 "@react-native-firebase/dynamic-links": "^10.3.1",
101 "@react-native-firebase/firestore": "^10.3.1",
102 "@react-native-firebase/iid": "^10.3.1",
103 "@react-native-firebase/in-app-messaging": "^10.3.1",
104 "@react-native-firebase/messaging": "^10.3.1",
105 "@react-native-firebase/perf": "^10.3.1",
106 "@react-native-firebase/remote-config": "^10.3.1",
107 "@react-native-firebase/storage": "^10.3.1",
108 "@react-native-picker/picker": "^2.1.0",
109 "@react-navigation/bottom-tabs": "^6.0.9",
110 "@react-navigation/native": "^6.0.6",
111 "@react-navigation/stack": "^6.0.11",
112 "@types/react-native": "^0.65.5",
113 "@ui-kitten/components": "^5.1.0",
114 "axios": "^0.19.0",
115 "i18n-js": "^3.5.1",
116 "moment": "^2.24.0",
117 "native-base": "2.13.8",
118 "react": "17.0.2",
119 "react-content-loader": "^4.3.4",
120 "react-native": "0.66.0",
121 "react-native-actions-sheet": "^0.5.6",
122 "react-native-adjust": "^4.28.0",
123 "react-native-amplitude-analytics": "^0.2.7",
124 "react-native-animatable": "^1.3.3",
125 "react-native-code-push": "^7.0.4",
126 "react-native-config": "^1.3.3",
127 "react-native-contacts": "^5.0.7",
128 "react-native-dots-pagination": "^0.2.0",
129 "react-native-fbsdk-next": "^6.2.0",
130 "react-native-fingerprint-scanner": "^6.0.0",
131 "react-native-floating-action": "^1.22.0",
132 "react-native-geocoding": "^0.4.0",
133 "react-native-geolocation-service": "^5.2.0",
134 "react-native-gesture-handler": "^1.5.2",
135 "react-native-get-random-values": "^1.4.0",
136 "react-native-html-to-pdf-lite": "^0.11.0",
137 "react-native-image-base64": "^0.1.4",
138 "react-native-image-pan-zoom": "^2.1.11",
139 "react-native-image-picker": "^4.1.2",
140 "react-native-image-resizer": "^1.2.0",
141 "react-native-in-app-review": "^2.1.7",
142 "react-native-linear-gradient": "^2.5.6",
143 "react-native-loading-spinner-overlay": "^1.1.0",
144 "react-native-material-menu": "^1.0.0",
145 "react-native-material-textfield": "^0.16.1",
146 "react-native-modal": "^13.0.0",
147 "react-native-phone-call": "^1.0.9",
148 "react-native-ratings": "^7.3.0",
149 "react-native-reanimated": "^1.13.0",
150 "react-native-safe-area-context": "^3.3.2",
151 "react-native-screens": "^3.9.0",
152 "react-native-share": "^7.2.1",
153 "react-native-smooth-pincode-input": "^1.0.9",
154 "react-native-sms-retriever": "https://github.com/sarmad1995/react-native-sms-retriever.git",
155 "react-native-snap-carousel": "^3.9.1",
156 "react-native-splash-screen": "^3.2.0",
157 "react-native-svg": "^12.1.1",
158 "react-native-version-check": "^3.4.2",
159 "react-native-version-number": "^0.3.6",
160 "react-native-view-shot": "^3.1.2",
161 "react-native-walkthrough-tooltip": "^1.3.0",
162 "react-redux": "^7.1.3",
163 "redux": "^4.0.4",
164 "redux-logger": "^3.0.6",
165 "redux-persist": "^6.0.0",
166 "redux-thunk": "^2.3.0",
167 "rn-fetch-blob": "^0.12.0",
168 "urbanairship-react-native": "^12.0.0",
169 "uuid": "^8.3.0"
170},
171implementation 'com.facebook.android:facebook-marketing:[4,5)'
172implementation 'com.facebook.android:facebook-marketing:latest.release'
173in android/app/build.gradle file.
Posted this so someone out there facing the same problem will find the solution easily. It took me and my team around one and a half day to figure it out as there is no clear solution out there.
Solution Ref: here
QUESTION
How do I set up NUnit in Visual Studio 2022?
Asked 2022-Feb-01 at 20:25Does NUnit work under Visual Studio 2022? All of the setup instructions I can find relate to previous versions of Visual Studio and reference things that are not present (such as "Tools -> Manage Extensions menu in Visual Studio. Click on Online and enter the search term as NUnit Test Adapter" - the search yields no results). If it does work, how do I set it up?
ANSWER
Answered 2021-Dec-21 at 10:54You can add both NUnit Framework and NUnit Test Adapter using NuGet Packages.
To do that, right click on your project in Solution Explorer, go to Manage NuGet packages..., in the Browse section type nunit, install NUnit package and the corresponding version adapter (NUnitTestAdapter for NUnit 2.x or NUnit3TestAdapter for NUnit 3.x).
QUESTION
TopAppBar flashing when navigating with Compose Navigation
Asked 2022-Feb-01 at 14:52I have 2 screens which both have their own Scaffold and TopAppBar. When I navigate between them using the Jetpack Navigation Compose library, the app bar flashes. Why does it happen and how can I get rid of this?
Code:
Navigation:
1@Composable
2fun TodoNavHost(
3 navController: NavHostController,
4 modifier: Modifier = Modifier
5) {
6 NavHost(
7 navController = navController,
8 startDestination = TodoScreen.TodoList.name,
9 modifier = modifier
10 ) {
11 composable(TodoScreen.TodoList.name) {
12 TodoListScreen(
13 onTodoEditClicked = { todo ->
14 navController.navigate("${TodoScreen.AddEditTodo.name}?todoId=${todo.id}")
15 },
16 onFabAddNewTodoClicked = {
17 navController.navigate(TodoScreen.AddEditTodo.name)
18 }
19 )
20 }
21 composable(
22 "${TodoScreen.AddEditTodo.name}?todoId={todoId}",
23 arguments = listOf(
24 navArgument("todoId") {
25 type = NavType.LongType
26 defaultValue = -1L
27 }
28 )
29 ) {
30 AddEditTodoScreen(
31 onNavigateUp = {
32 navController.popBackStack()
33 },
34 onNavigateBackWithResult = { result ->
35 navController.navigate(TodoScreen.TodoList.name)
36 }
37 )
38 }
39 }
40}
41Todo list screen Scaffold with TopAppBar:
1@Composable
2fun TodoNavHost(
3 navController: NavHostController,
4 modifier: Modifier = Modifier
5) {
6 NavHost(
7 navController = navController,
8 startDestination = TodoScreen.TodoList.name,
9 modifier = modifier
10 ) {
11 composable(TodoScreen.TodoList.name) {
12 TodoListScreen(
13 onTodoEditClicked = { todo ->
14 navController.navigate("${TodoScreen.AddEditTodo.name}?todoId=${todo.id}")
15 },
16 onFabAddNewTodoClicked = {
17 navController.navigate(TodoScreen.AddEditTodo.name)
18 }
19 )
20 }
21 composable(
22 "${TodoScreen.AddEditTodo.name}?todoId={todoId}",
23 arguments = listOf(
24 navArgument("todoId") {
25 type = NavType.LongType
26 defaultValue = -1L
27 }
28 )
29 ) {
30 AddEditTodoScreen(
31 onNavigateUp = {
32 navController.popBackStack()
33 },
34 onNavigateBackWithResult = { result ->
35 navController.navigate(TodoScreen.TodoList.name)
36 }
37 )
38 }
39 }
40}
41@Composable
42fun TodoListBody(
43 todos: List<Todo>,
44 todoExpandedStates: Map<Long, Boolean>,
45 onTodoItemClicked: (Todo) -> Unit,
46 onTodoCheckedChanged: (Todo, Boolean) -> Unit,
47 onTodoEditClicked: (Todo) -> Unit,
48 onFabAddNewTodoClicked: () -> Unit,
49 onDeleteAllCompletedConfirmed: () -> Unit,
50 modifier: Modifier = Modifier,
51 errorSnackbarMessage: String = "",
52 errorSnackbarShown: Boolean = false
53) {
54
55 var menuExpanded by remember { mutableStateOf(false) }
56 var showDeleteAllCompletedConfirmationDialog by rememberSaveable { mutableStateOf(false) }
57
58 Scaffold(
59 modifier,
60 topBar = {
61 TopAppBar(
62 title = { Text("My Todos") },
63 actions = {
64 IconButton(
65 onClick = { menuExpanded = !menuExpanded },
66 modifier = Modifier.semantics {
67 contentDescription = "Options Menu"
68 }
69 ) {
70 Icon(Icons.Default.MoreVert, contentDescription = "Show menu")
71 }
72 DropdownMenu(
73 expanded = menuExpanded,
74 onDismissRequest = { menuExpanded = false }) {
75 DropdownMenuItem(
76 onClick = {
77 showDeleteAllCompletedConfirmationDialog = true
78 menuExpanded = false
79 },
80 modifier = Modifier.semantics {
81 contentDescription = "Option Delete All Completed"
82 }) {
83 Text("Delete all completed")
84 }
85 }
86 }
87
88 )
89 },
90[...]
91Add/edit screen Scaffold with TopAppBar:
1@Composable
2fun TodoNavHost(
3 navController: NavHostController,
4 modifier: Modifier = Modifier
5) {
6 NavHost(
7 navController = navController,
8 startDestination = TodoScreen.TodoList.name,
9 modifier = modifier
10 ) {
11 composable(TodoScreen.TodoList.name) {
12 TodoListScreen(
13 onTodoEditClicked = { todo ->
14 navController.navigate("${TodoScreen.AddEditTodo.name}?todoId=${todo.id}")
15 },
16 onFabAddNewTodoClicked = {
17 navController.navigate(TodoScreen.AddEditTodo.name)
18 }
19 )
20 }
21 composable(
22 "${TodoScreen.AddEditTodo.name}?todoId={todoId}",
23 arguments = listOf(
24 navArgument("todoId") {
25 type = NavType.LongType
26 defaultValue = -1L
27 }
28 )
29 ) {
30 AddEditTodoScreen(
31 onNavigateUp = {
32 navController.popBackStack()
33 },
34 onNavigateBackWithResult = { result ->
35 navController.navigate(TodoScreen.TodoList.name)
36 }
37 )
38 }
39 }
40}
41@Composable
42fun TodoListBody(
43 todos: List<Todo>,
44 todoExpandedStates: Map<Long, Boolean>,
45 onTodoItemClicked: (Todo) -> Unit,
46 onTodoCheckedChanged: (Todo, Boolean) -> Unit,
47 onTodoEditClicked: (Todo) -> Unit,
48 onFabAddNewTodoClicked: () -> Unit,
49 onDeleteAllCompletedConfirmed: () -> Unit,
50 modifier: Modifier = Modifier,
51 errorSnackbarMessage: String = "",
52 errorSnackbarShown: Boolean = false
53) {
54
55 var menuExpanded by remember { mutableStateOf(false) }
56 var showDeleteAllCompletedConfirmationDialog by rememberSaveable { mutableStateOf(false) }
57
58 Scaffold(
59 modifier,
60 topBar = {
61 TopAppBar(
62 title = { Text("My Todos") },
63 actions = {
64 IconButton(
65 onClick = { menuExpanded = !menuExpanded },
66 modifier = Modifier.semantics {
67 contentDescription = "Options Menu"
68 }
69 ) {
70 Icon(Icons.Default.MoreVert, contentDescription = "Show menu")
71 }
72 DropdownMenu(
73 expanded = menuExpanded,
74 onDismissRequest = { menuExpanded = false }) {
75 DropdownMenuItem(
76 onClick = {
77 showDeleteAllCompletedConfirmationDialog = true
78 menuExpanded = false
79 },
80 modifier = Modifier.semantics {
81 contentDescription = "Option Delete All Completed"
82 }) {
83 Text("Delete all completed")
84 }
85 }
86 }
87
88 )
89 },
90[...]
91@Composable
92fun AddEditTodoBody(
93 todo: Todo?,
94 todoTitle: String,
95 setTitle: (String) -> Unit,
96 todoImportance: Boolean,
97 setImportance: (Boolean) -> Unit,
98 onSaveClick: () -> Unit,
99 onNavigateUp: () -> Unit,
100 modifier: Modifier = Modifier
101) {
102 Scaffold(
103 modifier,
104 topBar = {
105 TopAppBar(
106 title = { Text(todo?.let { "Edit Todo" } ?: "Add Todo") },
107 actions = {
108 IconButton(onClick = onSaveClick) {
109 Icon(Icons.Default.Save, contentDescription = "Save Todo")
110 }
111 },
112 navigationIcon = {
113 IconButton(onClick = onNavigateUp) {
114 Icon(Icons.Default.ArrowBack, contentDescription = "Back")
115 }
116 }
117 )
118 },
119 ) { innerPadding ->
120 BodyContent(
121 todoTitle = todoTitle,
122 setTitle = setTitle,
123 todoImportance = todoImportance,
124 setImportance = setImportance,
125 modifier = Modifier.padding(innerPadding)
126 )
127 }
128}
129ANSWER
Answered 2021-Aug-03 at 11:33It is the expected behaviour. You are constructing two separate app bars for both the screens so they are bound to flash. This is not the correct way. The correct way would be to actually put the scaffold in your main activity and place the NavHost as it's content. If you wish to modify the app bar, create variables to hold state. Then modify them from the Composables. Ideally, store then in a viewmodel. That is how it is done in compose. Through variables.
Thanks
QUESTION
Accessing the original file name of R markdown parameters file
Asked 2022-Jan-20 at 23:04I want to provide the user a convenient way to define the input file. For this I am using the parameters functionality in markdown. If I "knit with parameters" I get asked for the input file.
Is there any chance to retrieve the file name? Because I am creating during the markdown some different files and I would use the filename of the input file as a prefix. So far, the file gets uploaded in a temp directory and there, the original file name is lost.
How can I get the file name and location via drop down menu into my markdown document? I don't want the user to write the path and filename manually.
1---
2title: "Untitled"
3date: "11/16/2021"
4output: html_document
5params:
6 date_file:
7 label: "date file"
8 value: 'dates.tsv'
9 input: file
10---
11
12```{r setup, include=FALSE}
13knitr::opts_chunk$set(echo = TRUE)
14```
15
16## R Markdown
17
18Filename: `r params$date_file`
19ANSWER
Answered 2021-Nov-22 at 16:40You could have users select a file in the rendered document by embedding a Shiny application. The caveat is that all expressions involving dependencies of the user's selection have to be wrapped inside of reactive(). That is obviously not optimal if you are trying to teach R, but in case it helps or inspires a better answer, here is an example:
1---
2title: "Untitled"
3date: "11/16/2021"
4output: html_document
5params:
6 date_file:
7 label: "date file"
8 value: 'dates.tsv'
9 input: file
10---
11
12```{r setup, include=FALSE}
13knitr::opts_chunk$set(echo = TRUE)
14```
15
16## R Markdown
17
18Filename: `r params$date_file`
19## Create a TSV file for testing
20cat("x\ty\n1\t2\n3\t4\n", file = "test.tsv")
211---
2title: "Untitled"
3date: "11/16/2021"
4output: html_document
5params:
6 date_file:
7 label: "date file"
8 value: 'dates.tsv'
9 input: file
10---
11
12```{r setup, include=FALSE}
13knitr::opts_chunk$set(echo = TRUE)
14```
15
16## R Markdown
17
18Filename: `r params$date_file`
19## Create a TSV file for testing
20cat("x\ty\n1\t2\n3\t4\n", file = "test.tsv")
21---
22title: "Untitled"
23output: html_document
24runtime: shiny
25---
26
27```{r setup, include=FALSE}
28knitr::opts_chunk$set(echo = TRUE)
29```
30
31Users can select a file by interacting with an embedded Shiny application.
32
33```{r ui, echo=FALSE}
34inputPanel(
35 fileInput("file", label = "Select a TSV file:", accept = ".tsv")
36)
37```
38
39User input is stored in a named list-like object `input`,
40but this object can only be accessed inside of a _reactive context_.
41
42```{r test1, error=TRUE}
43input$file$name
44## Name of file selected by user ... _not_ an absolute or relative path
45fn <- reactive(input$file$name)
46fn
47## Absolute path of temporary copy of file
48dp <- reactive(input$file$datapath)
49dp
50```
51
52Don't be misled by how `fn` and `dp` are printed. They are not
53strings, but _reactive expressions_. As as a result, they, too,
54must be handled inside of a reactive context.
55
56```{r test2}
57class(fn)
58reactive(class(fn()))
59```
60
61Some more examples:
62
63```{r test3, error=TRUE}
64## Define reactive data
65dd <- reactive(read.table(file = dp(), sep = "\t", header = TRUE))
66## Do stuff with it
67reactive(names(dd()))
68reactive(nrow(dd()))
69## Write object to file in _working directory_
70reactive(saveRDS(dd(), file = sub("tsv$", "rds", fn())))
71```
72QUESTION
Native Android -> How to create custom curved bottom navigation
Asked 2021-Dec-17 at 09:03
So this is the navigation my designer made for our project. Height of the bottom navigation is 70dp.
What I have tried so far.
First I downloaded a vector drawable background from design and set it as background for BottomNavigationView
1<com.google.android.material.bottomnavigation.BottomNavigationView
2 android:layout_gravity="bottom"
3 app:labelVisibilityMode="labeled"
4 app:itemIconTint="@drawable/bnv_tab_item_foreground"
5 app:itemTextColor="@drawable/bnv_tab_item_foreground"
6 android:id="@+id/bottom_nav"
7 android:layout_width="match_parent"
8 android:layout_height="70dp"
9 app:menu="@menu/menu_bottom_main"
10 android:background="@drawable/background_bottom_navigation"/>
11Result
As you can see the curve does not as good as in design. Because of different android screen sizes this approach will never work.
My second attempt was based on tutorial from Phillip Lackner https://www.youtube.com/watch?v=x6-_va1R788&t=830s
I put BottomNavigationView inside BottomAppBar. Then I created FloatingActionButton and set its layout_anchor property to BottomAppBar
1<com.google.android.material.bottomnavigation.BottomNavigationView
2 android:layout_gravity="bottom"
3 app:labelVisibilityMode="labeled"
4 app:itemIconTint="@drawable/bnv_tab_item_foreground"
5 app:itemTextColor="@drawable/bnv_tab_item_foreground"
6 android:id="@+id/bottom_nav"
7 android:layout_width="match_parent"
8 android:layout_height="70dp"
9 app:menu="@menu/menu_bottom_main"
10 android:background="@drawable/background_bottom_navigation"/>
11<com.google.android.material.bottomappbar.BottomAppBar
12 app:fabCradleRoundedCornerRadius="20dp"
13 android:backgroundTint="@color/blue_menu2"
14 android:id="@+id/bottom_app_bar"
15 android:layout_gravity="bottom"
16 android:layout_width="match_parent"
17 android:layout_height="56dp">
18 <com.google.android.material.bottomnavigation.BottomNavigationView
19 app:labelVisibilityMode="labeled"
20 app:itemIconTint="@drawable/bnv_tab_item_foreground"
21 app:itemTextColor="@drawable/bnv_tab_item_foreground"
22 android:id="@+id/bottom_nav"
23 app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
24 android:layout_marginEnd="16dp"
25 android:layout_width="match_parent"
26 android:layout_height="match_parent"
27 android:background="@android:color/transparent"
28 app:menu="@menu/menu_bottom_main" />
29 </com.google.android.material.bottomappbar.BottomAppBar>
30
31 <com.google.android.material.floatingactionbutton.FloatingActionButton
32 android:scaleType="center"
33 app:maxImageSize = "56dp"
34 android:id="@+id/home_floating_button"
35 app:layout_anchor="@id/bottom_app_bar"
36 android:layout_width="56dp"
37 android:layout_height="80dp">
38 </com.google.android.material.floatingactionbutton.FloatingActionButton>
39Result
As u can see the curve is not "Deep enough". BottomAppBar has property fabCradleVerticalOffset but unfortunately you cant put negative values.
Is it possible to use bezier curves to try to draw custom shapes in bottom navigation. I have not tried yet. I am not sure if it will work for this specific bottom navigation design. https://proandroiddev.com/how-i-drew-custom-shapes-in-bottom-bar-c4539d86afd7
How can I create this curved bottom navigation?
ANSWER
Answered 2021-Dec-17 at 09:03I think you cannot achieve this with BottomAppBar without working some hacks around it. I can suggest you use 2 FABs, an invisible one to get the BottomAppBar curved the way you wish, and another one (the actual one) and place it at the position you need it to be placed at, here is an example
1<com.google.android.material.bottomnavigation.BottomNavigationView
2 android:layout_gravity="bottom"
3 app:labelVisibilityMode="labeled"
4 app:itemIconTint="@drawable/bnv_tab_item_foreground"
5 app:itemTextColor="@drawable/bnv_tab_item_foreground"
6 android:id="@+id/bottom_nav"
7 android:layout_width="match_parent"
8 android:layout_height="70dp"
9 app:menu="@menu/menu_bottom_main"
10 android:background="@drawable/background_bottom_navigation"/>
11<com.google.android.material.bottomappbar.BottomAppBar
12 app:fabCradleRoundedCornerRadius="20dp"
13 android:backgroundTint="@color/blue_menu2"
14 android:id="@+id/bottom_app_bar"
15 android:layout_gravity="bottom"
16 android:layout_width="match_parent"
17 android:layout_height="56dp">
18 <com.google.android.material.bottomnavigation.BottomNavigationView
19 app:labelVisibilityMode="labeled"
20 app:itemIconTint="@drawable/bnv_tab_item_foreground"
21 app:itemTextColor="@drawable/bnv_tab_item_foreground"
22 android:id="@+id/bottom_nav"
23 app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
24 android:layout_marginEnd="16dp"
25 android:layout_width="match_parent"
26 android:layout_height="match_parent"
27 android:background="@android:color/transparent"
28 app:menu="@menu/menu_bottom_main" />
29 </com.google.android.material.bottomappbar.BottomAppBar>
30
31 <com.google.android.material.floatingactionbutton.FloatingActionButton
32 android:scaleType="center"
33 app:maxImageSize = "56dp"
34 android:id="@+id/home_floating_button"
35 app:layout_anchor="@id/bottom_app_bar"
36 android:layout_width="56dp"
37 android:layout_height="80dp">
38 </com.google.android.material.floatingactionbutton.FloatingActionButton>
39
40 <androidx.coordinatorlayout.widget.CoordinatorLayout
41 android:layout_width="match_parent"
42 android:layout_height="350dp"
43 app:layout_constraintTop_toTopOf="parent">
44
45 <com.google.android.material.bottomappbar.BottomAppBar
46 android:id="@+id/bottom_app_bar"
47 app:fabCradleMargin="15dp"
48 app:fabCradleVerticalOffset="10dp"
49 app:fabCradleRoundedCornerRadius="10dp"
50 android:layout_width="match_parent"
51 android:layout_height="70dp"
52 android:layout_gravity="bottom"
53 android:backgroundTint="#0000FF"
54 app:layout_constraintTop_toTopOf="parent">
55
56 </com.google.android.material.bottomappbar.BottomAppBar>
57
58 <com.google.android.material.floatingactionbutton.FloatingActionButton
59 android:id="@+id/home_floating_button"
60 android:layout_width="58dp"
61 android:layout_height="40dp"
62 android:alpha="0"
63 android:scaleY="2"
64 android:scaleType="center"
65 app:layout_anchor="@id/bottom_app_bar" />
66
67 <com.google.android.material.floatingactionbutton.FloatingActionButton
68 android:id="@+id/home_floating_button2"
69 android:layout_width="58dp"
70 android:layout_height="80dp"
71 android:scaleType="center"
72 android:layout_marginBottom="25dp"
73 app:layout_anchorGravity="center"
74 app:layout_anchor="@id/bottom_app_bar"
75 app:maxImageSize="56dp"/>
76
77 </androidx.coordinatorlayout.widget.CoordinatorLayout>
78
79
QUESTION
Angular 6 to 12 Migration: Getting Multiple Warning: Css Minimizer Plugin: > Unexpected "$"
Asked 2021-Nov-19 at 17:27After migrating my angular 6 project to 12. I am getting multiple warning in terminal
if in angular.json i set optimisation: false configuration then all issue get resolved but i don't want to make this changes it should be true only.
with optimisation: true i am getting all these warnings:-
Earlier same code was working fine without any warning.
1assets/.../variables.scss - Warning: Css Minimizer Plugin: > assets/.../variables.scss:6:0: warning: Unexpected "$"
2 6 │ $color-normal-gray:#8a8a8a;
3 ╵ ^
4
5assets/.../global.scss - Warning: Css Minimizer Plugin: >
6assets/.../global.scss:285:2: warning: Expected identifier but found "."
7 285 │ .dropdown-menu{
8 ╵ ^
9
10assets/.../global.scss - Warning: Css Minimizer Plugin: >
11assets/.../global.scss:255:6: warning: Expected identifier but found "*"
12 255 │ *background-color: #d9d9d9;
13 ╵ ^
14
15assets/.../master.scss - Warning: Css Minimizer Plugin: >
16assets/.../master.scss:567:8: warning: Expected ":" but found "{"
17 567 │ circle {
18 ╵ ^
19My Package.json is below:
1assets/.../variables.scss - Warning: Css Minimizer Plugin: > assets/.../variables.scss:6:0: warning: Unexpected "$"
2 6 │ $color-normal-gray:#8a8a8a;
3 ╵ ^
4
5assets/.../global.scss - Warning: Css Minimizer Plugin: >
6assets/.../global.scss:285:2: warning: Expected identifier but found "."
7 285 │ .dropdown-menu{
8 ╵ ^
9
10assets/.../global.scss - Warning: Css Minimizer Plugin: >
11assets/.../global.scss:255:6: warning: Expected identifier but found "*"
12 255 │ *background-color: #d9d9d9;
13 ╵ ^
14
15assets/.../master.scss - Warning: Css Minimizer Plugin: >
16assets/.../master.scss:567:8: warning: Expected ":" but found "{"
17 567 │ circle {
18 ╵ ^
19 "dependencies": {
20 "@angular/animations": "^12.2.3",
21 "@angular/cdk": "^12.2.2",
22 "@angular/common": "^12.2.3",
23 "@angular/compiler": "^12.2.3",
24 "@angular/core": "^12.2.3",
25 "@angular/forms": "^12.2.3",
26 "@angular/http": "^7.2.16",
27 "@angular/material": "^12.2.3",
28 "@angular/platform-browser": "^12.2.3",
29 "@angular/platform-browser-dynamic": "^12.2.3",
30 "@angular/router": "^12.2.3",
31 "@fortawesome/fontawesome-free": "^5.15.4",
32 "@ngrx/store": "^6.1.0",
33 "@okta/okta-angular": "^3.0.1",
34 "@okta/okta-auth-js": "^4.7.1",
35 "angular-datatables": "^0.6.4",
36 "angular-image-slider": "0.0.8",
37 "autobind-decorator": "^2.4.0",
38 "bootstrap": "^4.6.0",
39 "core-js": "^2.5.4",
40 "file-saver": "^2.0.2",
41 "gulp-cli": "^2.3.0",
42 "json-bigint": "^1.0.0",
43 "jsrsasign": "^10.3.0",
44 "lodash": "4.17.10",
45 "ng-simple-slideshow": "^1.2.4",
46 "ng2-scroll-to-el": "^1.2.1",
47 "ng2-search-filter": "^0.4.7",
48 "ngx-filter-pipe": "^2.1.2",
49 "ngx-logger": "3.3.11",
50 "ngx-order-pipe": "^2.0.1",
51 "ngx-pagination": "^3.2.0",
52 "pagination": "file:src/app/packages/pagination-0.0.1.tgz",
53 "rxjs": "7.3.0",
54 "rxjs-compat": "^6.3.2",
55 "sass": "^1.36.0",
56 "single-spa": "^5.9.2",
57 "single-spa-angular": "^5.0.2",
58 "systemjs": "^6.8.3",
59 "true-case-path": "^1.0.3",
60 "tslint": "^6.0.0",
61 "xlsx": "^0.17.1",
62 "zone.js": "~0.11.4"
63 },
64 "devDependencies": {
65 "@angular-builders/custom-webpack": "^12.1.1",
66 "@angular-devkit/build-angular": "^12.2.2",
67 "@angular-eslint/builder": "12.3.1",
68 "@angular-eslint/eslint-plugin": "12.3.1",
69 "@angular-eslint/eslint-plugin-template": "12.3.1",
70 "@angular-eslint/schematics": "12.3.1",
71 "@angular-eslint/template-parser": "12.3.1",
72 "@angular/cli": "^12.2.2",
73 "@angular/compiler-cli": "^12.2.3",
74 "@angular/language-service": "^12.2.3",
75 "@ng-bootstrap/ng-bootstrap": "^10.0.0",
76 "@types/bootstrap": "^4.1.2",
77 "@types/jasmine": "2.8.6",
78 "@types/jasminewd2": "2.0.3",
79 "@types/lodash": "4.14.110",
80 "@types/node": "14.6.2",
81 "@typescript-eslint/eslint-plugin": "4.28.2",
82 "@typescript-eslint/parser": "4.28.2",
83 "await": "^0.2.6",
84 "cheerio": "^1.0.0-rc.2",
85 "codelyzer": "~4.2.1",
86 "eslint": "^7.26.0",
87 "font-awesome": "^4.7.0",
88 "fs-promise": "^2.0.3",
89 "gulp": "^4.0.2",
90 "gulp-inline-css": "^3.3.0",
91 "gulp-inline-source": "^4.0.0",
92 "htmlhint-ng2": "0.0.13",
93 "husky": "^1.3.1",
94 "jasmine-core": "~2.99.1",
95 "jasmine-spec-reporter": "~4.2.1",
96 "karma": "^6.3.4",
97 "karma-chrome-launcher": "^2.2.0",
98 "karma-coverage-istanbul-reporter": "^2.1.1",
99 "karma-jasmine": "~1.1.1",
100 "karma-jasmine-html-reporter": "^0.2.2",
101 "karma-junit-reporter": "^1.2.0",
102 "mediaquery-text": "1.0.7",
103 "ng-bullet": "^1.0.3",
104 "protractor": "^5.4.2",
105 "puppeteer": "^1.14.0",
106 "sonar-scanner": "^3.1.0",
107 "ts-node": "~5.0.1",
108 "tslint": "~5.9.1",
109 "tslint-sonarts": "^1.9.0",
110 "typescript": "^4.3.5"
111 }
112ANSWER
Answered 2021-Sep-08 at 10:30I had the same problem. You should change the import of 'assets/.../variables.scss' to './assets/.../variables.scss'. In my case it was in styles.scss but it can be in every .scss file.
QUESTION
Why checkout step not recorded in the Google Analytics report?
Asked 2021-Nov-19 at 01:58I'm making an enhanched ecommerce tracking with google analytics. I'm following the existing implementation in gtag.js. I have 4 checkout steps including shipping method data, payment method data, pending payment, and also paid (purchase). I've made the codes for each step below:
1. Shipping Method
1<script>
2 gtag('event', 'set_checkout_option', {
3 "checkout_step": 1,
4 "checkout_option": "shipping method",
5 "value": ""
6 });
7</script>
82. Payment Method
1<script>
2 gtag('event', 'set_checkout_option', {
3 "checkout_step": 1,
4 "checkout_option": "shipping method",
5 "value": ""
6 });
7</script>
8<script>
9 gtag('event', 'set_checkout_option', {
10 "checkout_step": 2,
11 "checkout_option": "payment method",
12 "value": ""
13 });
14</script>
153. Pending Payment
1<script>
2 gtag('event', 'set_checkout_option', {
3 "checkout_step": 1,
4 "checkout_option": "shipping method",
5 "value": ""
6 });
7</script>
8<script>
9 gtag('event', 'set_checkout_option', {
10 "checkout_step": 2,
11 "checkout_option": "payment method",
12 "value": ""
13 });
14</script>
15$("#order-now-action").on('click', function() {
16 gtag('event', 'set_checkout_option', {
17 "checkout_step": 3,
18 "checkout_option": "pending",
19 "id": ""
20 });
21})
22This is the checkout funnel that I created in Ecommerce Settings.
And this is a report in the checkout behavior menu. The shipping method is recorded, but why in step 2 (payment method) to step 4 (purchase) is it not recorded?
even though, in the sales performance menu, the transaction is recorded?
for steps 1-3 is in 1 page, while the purchase (step 4) I did on the backend using a single url. Is it because it's on 1 page so it's not recorded?
ANSWER
Answered 2021-Nov-18 at 13:32Generally, your setup looks fine. I would, however, suggest to do it as shown in Google's documentation: https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce
1<script>
2 gtag('event', 'set_checkout_option', {
3 "checkout_step": 1,
4 "checkout_option": "shipping method",
5 "value": ""
6 });
7</script>
8<script>
9 gtag('event', 'set_checkout_option', {
10 "checkout_step": 2,
11 "checkout_option": "payment method",
12 "value": ""
13 });
14</script>
15$("#order-now-action").on('click', function() {
16 gtag('event', 'set_checkout_option', {
17 "checkout_step": 3,
18 "checkout_option": "pending",
19 "id": ""
20 });
21})
22function onShippingComplete(stepNumber, shippingOption) {
23 ga('ec:setAction', 'checkout_option', {
24 'step': stepNumber,
25 'option': shippingOption
26 });
27
28 ga('send', 'event', 'Checkout', 'Option', {
29 hitCallback: function() {
30 // Advance to next page.
31 }
32 });
33}But let's debug:
Either in the Network tab, or through a debugger extension like adswerve's, make sure you're actually sending the calls to the
collectendpoint. Go through the checkout funnel, trigger the events and inspect them. Pay attention to the property id (it's in the tid field of the payload sent to google's collect endpoint)Make sure you're generating reports on the data that has been fully processed by GA, so at least 2-day-old data for non-360 accounts and at least 4 hour-old for 360.
Make sure your session is not broken between the first step and the actual purchase. For this, you either have to use the user explorer and actually see where the checkout session breaks for a specific client id. Or track a session id in a custom dimension and see that you can see all the checkout events when inspecting specific session id in a custom report. Session breakage often occurs when the source changes, or when the user id consistency breaks. A good real life example for it would be shopify's checkout being on a different TLD.
Make sure you're looking at an unfiltered view just to exclude the possibility of filters interfering with the data and deleting your events.
Community Discussions contain sources that include Stack Exchange Network
Tutorials and Learning Resources in Menu
Tutorials and Learning Resources are not available at this moment for Menu
Share this Page
Get latest updates on Menu