无法在Ext JS应用程序中包含ux

时间:2018-10-18 17:12:29

标签: javascript extjs extjs6

该应用程序不包括UX。 整个extjs库位于-myexample/js/ext-6.2.0中 我从myexample/js/ext-6.2.0/复制的文件夹“ ux”中包含了所有内容,并打包到了我的应用程序中

test
|---app.js
|
|---app
|    |---controller
|    |---model
|    |---store
|    |---ux 
|    |---view
|---index.html

然后在app.js中,在调用应用程序之前,我先连接“ ux”:

Ext.Loader.setConfig({enabled:true});
Ext.Loader.setPath('Ext.ux', 'app/ux');
Ext.application({
....

我得到了错误:

  

[Ext.Loader]同步加载'widget.treepicker';考虑   在Ext.onReady之上添加Ext.require('widget.treepicker')

版本:Ext JS 6.2.0.981-JavaScript库

我在做什么错? 如何增加UX? 谢谢。

2 个答案:

答案 0 :(得分:1)

尝试将其添加到app.js文件中

requires:[
    'Ext.ux.your_file_name' //your_file_name inside the ux folder
]

答案 1 :(得分:0)

在文件“ app.json”中,您应该找到与此类似的“ requires”配置

     private void initUIWidgets() {
            thumbrecyclerView =  findViewById(R.id.thumbnails);
            image_view =  findViewById(R.id.place_holder_ImageView);
            image_view.setImageBitmap(testbitmap);
            initHorizontalList();
        }

        private void initHorizontalList() {
            LinearLayoutManager layoutManager = new LinearLayoutManager(this);
            layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
            layoutManager.scrollToPosition(0);
            thumbrecyclerView.setLayoutManager(layoutManager);
            thumbrecyclerView.setHasFixedSize(true);
            bindDataToAdapter();
        }

        private void bindDataToAdapter() {
            final Context context = this.getApplication();
            Handler handler = new Handler();
            Runnable runnable = new Runnable() {
                public void run() {
                    Bitmap thumbImage = testbitmap;
                    ThumbnailItem t1 = new ThumbnailItem();
                    ThumbnailItem t2 = new ThumbnailItem();
                    ThumbnailItem t3 = new ThumbnailItem();
                    ThumbnailItem t4 = new ThumbnailItem();
                    ThumbnailItem t5 = new ThumbnailItem();
                    ThumbnailItem t6 = new ThumbnailItem();

                    t1.image = thumbImage;
                    t2.image = thumbImage;
                    t3.image = thumbImage;
                    t4.image = thumbImage;
                    t5.image = thumbImage;
                    t6.image = thumbImage;
                    ThumbnailsManager.clearThumbs();
                    ThumbnailsManager.addThumb(t1); // Original Image

                    t2.filter = SampleFilters.getStarLitFilter();
                    ThumbnailsManager.addThumb(t2);

                    t3.filter = SampleFilters.getBlueMessFilter();
                    ThumbnailsManager.addThumb(t3);

                    t4.filter = SampleFilters.getAweStruckVibeFilter();
                    ThumbnailsManager.addThumb(t4);

                    t5.filter = SampleFilters.getLimeStutterFilter();
                    ThumbnailsManager.addThumb(t5);

                    t6.filter = SampleFilters.getNightWhisperFilter();
                    ThumbnailsManager.addThumb(t6);

                    List<ThumbnailItem> thumbs = ThumbnailsManager.processThumbs(context);

                    ThumbnailsAdapter adapter = new ThumbnailsAdapter(thumbs, (ThumbnailCallback) activity);
                    thumbrecyclerView.setAdapter(adapter);
                    adapter.notifyDataSetChanged();
                }
            };
            handler.post(runnable);
        }

        @Override
        public void onThumbnailClick(Filter filter) {
            image_view =  findViewById(R.id.place_holder_ImageView);
            Bitmap abc = filter.processFilter(testbitmap);
            image_view.setImageBitmap(abc);
        }

    }


 private void initUIWidgets() {
        thumbrecyclerView =  findViewById(R.id.thumbnails);
        placeHolderImageView =  findViewById(R.id.place_holder_imageview);
        placeHolderImageView.setImageBitmap(Bitmap.createScaledBitmap(BitmapFactory.decodeResource(this.getApplicationContext().getResources(), R.drawable.photo), 640, 640, false));
        initHorizontalList();
    }

    private void initHorizontalList() {
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
        layoutManager.scrollToPosition(0);
        thumbrecyclerView.setLayoutManager(layoutManager);
        thumbrecyclerView.setHasFixedSize(true);
        bindDataToAdapter();
    }

    private void bindDataToAdapter() {
        final Context context = this.getApplication();
        Handler handler = new Handler();
        Runnable r = new Runnable() {
            public void run() {
                Bitmap thumbImage = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(context.getResources(), R.drawable.photo), 640, 640, false);
                ThumbnailItem t1 = new ThumbnailItem();
                ThumbnailItem t2 = new ThumbnailItem();
                ThumbnailItem t3 = new ThumbnailItem();
                ThumbnailItem t4 = new ThumbnailItem();
                ThumbnailItem t5 = new ThumbnailItem();
                ThumbnailItem t6 = new ThumbnailItem();

                t1.image = thumbImage;
                t2.image = thumbImage;
                t3.image = thumbImage;
                t4.image = thumbImage;
                t5.image = thumbImage;
                t6.image = thumbImage;
                ThumbnailsManager.clearThumbs();
                ThumbnailsManager.addThumb(t1); // Original Image

                t2.filter = SampleFilters.getStarLitFilter();
                ThumbnailsManager.addThumb(t2);

                t3.filter = SampleFilters.getBlueMessFilter();
                ThumbnailsManager.addThumb(t3);

                t4.filter = SampleFilters.getAweStruckVibeFilter();
                ThumbnailsManager.addThumb(t4);

                t5.filter = SampleFilters.getLimeStutterFilter();
                ThumbnailsManager.addThumb(t5);

                t6.filter = SampleFilters.getNightWhisperFilter();
                ThumbnailsManager.addThumb(t6);

                List<ThumbnailItem> thumbs = ThumbnailsManager.processThumbs(context);

                ThumbnailsAdapter adapter = new ThumbnailsAdapter(thumbs, (ThumbnailCallback) activity);
                thumbrecyclerView.setAdapter(adapter);
                adapter.notifyDataSetChanged();
            }
        };
        handler.post(r);
    }

    @Override
    public void onThumbnailClick(Filter filter) {
        placeHolderImageView.setImageBitmap(filter.processFilter(Bitmap.createScaledBitmap(BitmapFactory.decodeResource(this.getApplicationContext().getResources(), R.drawable.photo), 640, 640, false)));
    }
}

“ app.json”将出现在Extjs应用程序文件夹中,该文件夹将是命令的结果:

 "requires": [
        "font-awesome",
        "charts",
        "ux"
    ]

这是您导入软件包的位置。因此,您的代码的一部分是使“ ext”包不被加载。这导致与“ treepicker”有关的错误。因为“ treepicker”是“ extjs”包的一部分。 尝试以这种方式包括包装。应该可以。