Flutter independencies - flutter-dependencies

import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
final wordPair = WordPair.random();
return MaterialApp(
theme: ThemeData(primaryColor: Colors.purple[900]),
home: Scaffold(
appBar: AppBar(title: Text('WorldPair Generator')),
`enter code here`body: Center(child: Text(wordPair.asPascaLCase))));
ERROR MESSAGE:
lib/main.dart:10:22: Error: The getter 'WordPair' isn't defined for the class 'MyApp'.
'MyApp' is from 'package:api_app/main.dart' ('lib/main.dart').
Try correcting the name to the name of an existing getter, or defining a getter or field named 'WordPair'.
final wordPair = WordPair.random();
^^^^^^^^

You can in pubspec.yaml add english_words: any in dependencies and click Pub get
See picture below

the author of english_words has actually turned off that command, so it doesnt work, But if you want to generate some random words, you can use the SuperHeroName Generator from pub.dev

Related

ViewManager receiveCommand is deprecated?

I've recently noticed in the react-native source code that the following method:
public void receiveCommand(#NonNull T root, int commandId, #Nullable ReadableArray args)
of the ViewManager class is marked as deprecated. Therefore, I tried to replace it with an overloaded version that is not marked as deprecated:
public void receiveCommand(#NonNull T root, String commandId, #Nullable ReadableArray args)
but this one never gets invoked. I imagine I also might need to change some other methods, but I cannot find any information what else has to be done, there is no migration guide that I could follow.
Does anyone know how to properly use the new, non-deprecated receiveCommand method?
The source code of the ViewManager can be found here:
https://github.com/facebook/react-native/blob/master/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewManager.java
The new, non-deprecated version of receiveCommand will get called if a String is sent as the second argument of the dispatchViewManagerCommand from your React Native code. There is no need to override getCommandsMap() anymore.
Example:
CustomViewManager.kt (In Kotlin, should be easy to convert to Java)
class CustomViewManager : SimpleViewManager<CustomView>() {
...
override fun createViewInstance( context: ThemedReactContext): CustomView {
// code to instantiate your view
}
...
override fun getName(): String {
return "CustomView"
}
...
override fun receiveCommand(view: CustomView, commandId: String, args: ReadableArray?) {
when (commandId) {
"doSomething" -> doSomething()
}
}
MyComponent.js
import { View, requireNativeComponent, UIManager, findNodeHandle } from 'react-native';
...
const CustomView = requireNativeComponent('CustomView');
...
export default class MyComponent extends Component {
...
onDoSomething = async () => {
UIManager.dispatchViewManagerCommand(
findNodeHandle(this.customView),
'doSomething',
undefined,
);
};
...
render() {
return (
<View>
<CustomView
ref={(component) => {
this.customView = component;
}}
/>
</View>
);
}
}

Applying a class type to a property in state in react native

I created a class in react native.
import Author from "./authorDetails";
class MainFeedPost {
id;
description;
postImage;
author;
creationDateTime;
version;
status;
extra = {
likes,
shares,
comments
};
constructor() {
this.author = new Author();
}
}
export default MainFeedPost;
Now I want to set this as a type in one of my components state. I tried it like this an it is undefined.
import { MainFeedPost } from "../../models";
class SharePostScreen extends Component {
constructor(props) {
super(props);
this.state = {
post: MainFeedPost
};
}
doesn't this support in react native? I want to initialize the shape of my object with MainFeedPost class.
You told "as a type". If you want static type checking, you need something like flow.
If you wanna value in the state, you must place there an instance:
...
this.state = {
post: new MainFeedPost(),
};
...
UPD:
I got your point. Because of default export you need to use import MainFeedPost from "...", without braces.

react-native static class properties

I had this working in a react-native app, but I feel I had to do some stuff with babel and I can't remember what it was. For whatever reason this is not working, it's saying cannot read property CONSTANT_1 of undefined.
export default class Main extends React.Component {
static MyClassProp = {
CONSTANT_1: 1,
CONSTANT_2: 2
};
static defaultProps = {
prop1: Main.MyClassProp.CONSTANT_1
};
...
}
Can anybody tell me if I'm supposed to include something in a .babelrc or package.json to get this to compile correctly?

Specialized Singleton implementation

I am looking for specialized singleton implementation, probably I might be using wrong terminology and hence looking for expert suggestion. Here is my scenario:
There is common code which can be called by ComponentA or ComponentB. I need to push telemetry data from the common code. Telemetry needs to have information that whether this common code get called by ComponentA or ComponentB.
So common code will have just this line of code:
telemetry.pushData(this._area, data);
where this._area tells the telemetry data is getting pushed for which component
I need to push telemetry data from multiple places so it would be good if object got created once and used through out the code lifetime
One option I can think of passing component context to the common code which in mind doesn't look right, hence looking for suggestion what kind of pattern one should use in this case?
This is what I am thinking
// Telemetry.ts file present in shared code
export class Telemetry extends Singleton {
public constructor() {
super();
}
public static instance(): Telemetry {
return super.instance<Telemetry>(Telemetry);
}
public publishEvent(data): void {
if (!this.area) {
throw new Error("Error: Initialize telemetry class with right area");
}
pushtelemetryData(this.area, data);
}
public area: string;
}
// Create Telemetry object from component A
Telemetry.instance().area = "ComponentA";
// Shared code will call telemetry publishEvent
Telemetry.instance().publishEvent(data);
Thanks
It's not a good pattern to use in TypeScript where you would generally inject dependencies.
If you must absolutely do it then you can do it by faking it somewhat:
namespace Telemetry {
var instance : SingletonSomething;
export function push(data: Any) : void {
if (instance == null) {
instance = new SingletonSomething();
}
instance.push(data);
}
class SingletonSomething() { ... }
}
and then you could call
Telemetry.push(data);
You can imitate the singleton pattern in typescript easily:
class Telemetry {
private static instance: Telemetry;
public static getInstance(): Telemetry {
if (Telemetry.instance == null) {
Telemetry.instance = new Telemetry();
}
return Telemetry.instance;
}
...
}
If you have your code in some sort of closure (module, namespace, etc) then you can replace the static member with:
let telemetryInstance: Telemetry;
export class Telemetry {
public static getInstance(): Telemetry {
if (telemetryInstance == null) {
telemetryInstance = new Telemetry();
}
return telemetryInstance;
}
...
}
But then you can also replace the static method with:
let telemetryInstance: Telemetry;
export function getTelemetryInstance(): Telemetry {
if (telemetryInstance == null) {
telemetryInstance = new Telemetry();
}
return telemetryInstance;
}
export class Telemetry {
...
}
At this point, in case you are using some sort of closure, you might ask yourself if you really need the class at all?
If you use this as a module:
// telemetry.ts
export interface TelemetryData {
...
}
export function pushData(data: TelemetryData): void {
...
}
Then you get exactly what you're looking for, and this is more of the "javascript way" of doing it.
Edit
In the telemetry module there's no need to know the users of it.
If the Telemetry.pushData function needs to have information about the object that called it then define an interface for it:
// telemetry.ts
export interface TelemetryData {
...
}
export interface TelemetryComponent {
name: string;
...
}
export function pushData(data: TelemetryData, component: TelemetryComponent): void {
...
}
Then in the other modules, where you use it:
// someModule.ts
import * as Telemetry from "./telemetry";
class MyComponent implement Telemetry.TelemetryComponent {
// can also be a simple string property
public get name() {
return "MyComponent";
}
fn() {
...
Telemetry.pushData({ ... }, this);
}
}
2nd Edit
Because you are using a module system, your module files are enough to make singletons, there's no need for a class to achieve that.
You can do this:
// telemetry.ts
let area: string;
export interface TelemetryData {
...
}
export function setArea(usedArea: string) {
area = usedArea;
}
export function pushData(data: TelemetryData): void {
...
}
Then:
Telemetry.setArea("ComponentA");
...
Telemetry.publishEvent(data);
The telemetry module will be created only once per page, so you can treat the entire module as a singleton.
Export only the functions that are needed.

Why does Luxe/Flow quit unexpectedly after building with my PhysicsHandler class?

My PhysicsHandler class seems to be causing Luxe to quit unexpectedly, and I have no idea why.
Everything runs fine until I declare a class-variable, at which point it crashes a couple of seconds after loading. What's weird is that I have another class (InputHandler) that declares class-variables and runs fine. Not sure whether this is a problem with my code (somehow... ), Luxe, or Flow.
Main class:
import luxe.Input;
import luxe.Parcel;
import luxe.ParcelProgress;
import InputHandler;
import PhysicsHandler;
import Player;
enum GAME_STATE
{
play;
pause;
}
class Main extends luxe.Game {
var INPUT_HANDLER: InputHandler;
override function ready() {
var assetsParcel = new Parcel
({
textures:
[
{ id:"assets/block.png" },
{ id:"assets/background.png" }
]
});
new ParcelProgress
({
parcel : assetsParcel,
oncomplete : onAssetsLoaded
});
assetsParcel.load();
INPUT_HANDLER = new InputHandler();
INPUT_HANDLER.GameState = GAME_STATE.play;
}
private function onAssetsLoaded(_)
{
var player = new Player();
INPUT_HANDLER.setPlayerEntity(player);
}
override function update(dt:Float) {
INPUT_HANDLER.update();
}
}
InputHandler class:
import luxe.Input;
import luxe.Entity;
import Main;
class InputHandler
{
public var GameState: EnumValue;
private var player: Entity;
// functions, etc. below here...
}
PhysicsHandler class (the troublemaker... ):
import Main;
class PhysicsHandler
{
public var GameState: EnumValue;
}
This is all it takes to crash the game somehow. As you can see, I'm not even instantiating the PhysicsHandler class yet, just importing it.
Okay, so I was able to sort this with some help on the Snowkit forums. Apparently, Luxe doesn't play well with the latest version of hxcpp, so downgrading to 3.2.102 worked. Result.