Locating FAQs

Incorrect Attribute Settings

  • Methods
  1. Open ArkUI Inspector at the bottom of DevEco Studio and select the application that encounters the issue. For details, see Layout Analysis. faq-inspector
  2. Find the faulty component on the displayed page. If the component is not displayed, you can use the component tree on the left of the page to find the component based on the text, component type, and tag (if attributes such as nativeId are not set, id is used by default).
  3. Select the component, view the attributes on the right of the page, and find the faulty attribute. faq-attributes
  4. Determine the cause based on the attribute.
    • The abnormal value cannot be processed by ArkUI and needs to be adapted.
    • The input value is incorrect. You need to find the incorrect value.
  5. Check the sources of the input attribute values:
    • Modify the component attributes by performing operations on the component tree. Print the operation in the handleMutation function of src/main/cpp/RNOH/SchedulerDelegateCAPI.h to check whether the component is created in a correct sequence.
    • Use the NativeDriver of Animated to modify the component attributes. Print the modified attributes in the synchronouslyUpdateViewOnUIThread function of src/main/cpp/RNOH/SchedulerDelegateCAPI.cpp to further determine the location where the fault occurs.
    • Both of the preceding methods proceed to onPropsChanged of xxxComponentInstance. Print the attributes here. Run the getTag command to obtain the tag information of the component and locate the fault based on the attributes.
  6. Determine the cause of the problem based on the faulty attribute and rectify the fault accordingly.
  7. If the component exits unexpectedly, rectify the fault by referring to the following related FAQ. If the problem is not common, see Troubleshooting Guidelines for CppCrash for analysis.

Image Loading Failure

  • Methods
  1. Check whether the path for loading an image by local mode or sandbox is correct. Currently, the directories for loading an image by local mode or sandbox are encoded in different ways. For an image loaded by local mode, the image is searched from the rawfile/assets directory, so the image resources need to be stored under this directory. For an image loaded by sandbox, the image is directly searched from the directory at the same level as the bundle, and no additional assets directory is required.
  2. Check whether the name of image is the same as that of the loaded image.
    • Print the path and file name of the image in onPropsChanged of src/main/cpp/RNOHCorePackage/ComponentInstances/ImageComponentInstance.cpp and compare them with those in the assets directory or sandbox directory. Ensure that they are consistent.
    • If they are different, check whether copyAssets is performed when a custom bundle command is used, to ensure that the image resource is consistent with that encoded in the bundle.
  3. Based on the troubleshooting for [incorrect attribute settings](#Incorrect Attribute Settings), check which attribute causes the image loading failure.

Running Errors After the Environment Is Updated

  • Methods

    Check whether the cache is not cleared.

    1. Click build -> clean project.
    2. Manually delete the temporary file directories (.cxx, oh_modules) generated by the project.
    3. Click File -> Sync and Refresh Project.

Failure to Set Events Effective

  • Example

    The RN side cannot receive the emitComponentEvent event of the Fabric component generated by the Codegen.

  • Symptom

    When you use the Codegen to implement a MarqueeView component that is the same as that in SampleApp and call emitComponentEvent to send the onStop event to the RN side, the event is not executed.

    this.ctx.rnInstance.emitComponentEvent(
         this.descriptor.tag,
         "onStop",
         { isStop: !this.start, type: "custom" }
      )
    
  • Cause

    The EventEmitter and EventEmitRequestHandler files are missing in the file structure generated by Codegen, and the generated code is contained in the RNOHGeneratedPackage.h file.

    class GeneratedEventEmitRequestHandler : public EventEmitRequestHandler {
         public:
            void handleEvent(Context const &ctx) override {
               auto eventEmitter = 
               ctx.shadowViewRegistry->getEventEmitter<facebook::react::EventEmitter>(ctx.tag);
               if (eventEmitter == nullptr) {
                     return;
               }
         
               std::vector<std::string> supportedEventNames = {
                     ...
                     "stop",
               };
               if (std::find(supportedEventNames.begin(), supportedEventNames.end(), ctx.eventName) != supportedEventNames.end()) {
                     eventEmitter->dispatchEvent(ctx.eventName, ArkJS(ctx.env).getDynamic(ctx.payload));
               }
            }
         };
    
      class RNOHGeneratedPackage : public Package {
            EventEmitRequestHandlers createEventEmitRequestHandlers() override {
               return {
                     std::make_shared<GeneratedEventEmitRequestHandler>(),
               };
            }
      };
    

    All Fabric components generated by Codegen use the same GeneratedEventEmitRequestHandler. Note that the event name in supportedEventNames is stop, which is automatically mapped to onStop at the JSI layer. Therefore, if onStop is used as the sending event name, the event name cannot be identified in the preceding code.

  • Solution

    Change the second parameter to stop.

    this.ctx.rnInstance.emitComponentEvent(
         this.descriptor.tag,
         "stop",
         { isStop: !this.start, type: "custom" }
      )