1. #1
    Sencha User
    Join Date
    Jun 2012
    Posts
    5
    Vote Rating
    0
    khajvah is on a distinguished road

      0  

    Default Still learning, have few questions.

    Still learning, have few questions.


    Hello people,

    I am learning this framework and have few questions:
    1.Can i use extjs with css to layout extjs components, if no..
    2.How can i layout components, and yes i saw layout part in documentation but too little information was provided.
    3.What is xtype?(i couldnt understand by reading documentation) My english is not great, so please explain in easier english.
    4.How can i create new class/component?

    Thanks in advance.

  2. #2
    Sencha User Tim Toady's Avatar
    Join Date
    Feb 2010
    Location
    Pennsylvania
    Posts
    536
    Vote Rating
    70
    Tim Toady is a jewel in the rough Tim Toady is a jewel in the rough Tim Toady is a jewel in the rough Tim Toady is a jewel in the rough

      1  

    Default


    Ext has its own system for layouts. For components such as container, form, and panel you can specify the layout property. It is much easier than how a developer would traditionally use css. For instance, if I had a component and I wanted its child item to stretch to the parent's full size I would you layout: 'fit'. If I wanted multiple children the take up a 100% of their parent I would use layout: 'hbox' and specify a flex property on them. You can see many layouts provided with code samples at the following link to get an idea of how they work:
    http://docs.sencha.com/ext-js/4-1/#!/example/layout-browser/layout-browser.html

    An xtype is simply a string property you can specify on a component configuration that represents a class. The configuration will then be instantiated as that class when it is needed.
    http://docs.sencha.com/ext-js/4-1/#!/api/Ext.AbstractComponent-cfg-xtype

    PHP Code:
    Ext.create'Ext.container.Viewport', {  //Here I use Ext.create which uses the full namespaced class
        
    layout'fit',     // I want my item to fill the entire viewport
        
    items: [
            {
                 
    xtype'panel',   //It is easy to use an xtype to specify the class of the child
                 
    title'test'
            
    }
       ]
    } ); 

  3. #3
    Sencha User
    Join Date
    Jun 2012
    Posts
    5
    Vote Rating
    0
    khajvah is on a distinguished road

      0  

    Default


    Thank you very much, you helped a lot, but i have one more question.

    Can i create my own component, so i will use only extjs for entire website... for example i want to create a navigation bar component, so i can layout with extjs or i can use extjs to layout simple <div>s?

  4. #4
    Sencha User Tim Toady's Avatar
    Join Date
    Feb 2010
    Location
    Pennsylvania
    Posts
    536
    Vote Rating
    70
    Tim Toady is a jewel in the rough Tim Toady is a jewel in the rough Tim Toady is a jewel in the rough Tim Toady is a jewel in the rough

      1  

    Default


    Yes you can create your own components. You can build them out of other components or use plain html.

  5. #5
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi!

    Take a look into this sample to add html in Extjs component:-

    Code:
    Ext.onReady(function(){
     new Ext.Panel({
         renderTo: Ext.getBody(),
            title: '3 Ways to render HTML inside of a ExtJS container',
            items: [{
                html: "<a href='#'>1. HTML property of a panel</a>",
                xtype: "panel"
            }, {
                xtype: "panel",
                html: new Ext.XTemplate("<a href='#'>{value}").apply({
                    value: '2. HTML property of a panel generated by an XTemplate'
                })
            }, {
                xtype: 'box',
                autoEl: {
                    tag: 'a'
                    html: '3. Dom element created by a DomHelper and wrapped as Component',              
                    href: '#'
                }
            }]
        });
    });
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."