ViewController

ViewController

Ein Ansichtscontroller verwaltet eine Reihe von Ansichten, die einen Teil der Benutzeroberfläche Ihrer App ausmachen. Sie soll die Benutzeroberfläche klarer und flexibler entwickeln.

Englisch | 中文 | Android 复杂界面开发实践之 ViewController: 介绍

Demo

Vorteil

• Machen Sie UI -Entwicklungskomponenten, beheben Sie das Problem des Code aufgebläht.
• Flexibel, eine Komponente kann an mehr Ort eingesetzt werden.
• Einfach gebrauchte, einfache Entwicklung.

Verwendung

Als gute Praxis empfehle ich Ihnen, Democode direkt auszuführen oder zu sehen.

Abhängigkeit importieren

Sie können die Abhängigkeit oder die Quelldatei in Ihrem Projekt direkt, bisher nur eine Datei in dieser LIB kopieren.

Fügen Sie das JITPACK -Repository in Ihre Build -Datei hinzu

allprojects {
	repositories {
		.. .
		maven { url " https://jitpack.io " }
	}
}

Fügen Sie die Abhängigkeit hinzu

dependencies {
	 compile ' com.github.maoruibin:ViewController:0.9.1 '
}

Komponente entwickeln

Genau wie dieses Demo -Bild sollten wir vier Komponenten entwickeln.

Jetzt möchte ich eine Kommentarkomponente als Demo entwickeln, ich werde den Punkt nach Code -Annotation vorstellen.

 // 1、every component mast extends ViewController
public class HouseCommentViewController extends ViewController < List < String >> 

// 2、indicate layout id for this component  
@ Override
protected int resLayoutId () {
    return R . layout . detail_comment_layout ;
}

// init this component's view element 
@ Override
protected void onCreatedView ( View view ) {
    mLlContainer = view . findViewById ( R . id . ll_container );
    ...
}

// bind data to this view component 
@ Override
protected void onBindView ( List < String > comments ) {
    for ( String comment : comments ) {
        TextView view = new TextView ( getContext ());
        view . setBackgroundResource ( R . color . bk_item );
        view . setText ( comment );
        int padding = Utils . dp2px ( 16 );
        view . setPadding ( padding , padding , padding , padding );
        mLlContainer . addView ( view );
    }
}

Jetzt haben wir eine einfache Ansichtskomponente abgeschlossen und Sie können die linken Komponenten per Demo -Code implementieren.

Komponente in der Aktivität zusammenstellen

Wir haben vier Komponenten für die UI von House Detail abgeschlossen.

 HousePhotoViewController    //House picture component 
HouseParamViewController    //House param info component
HouseDescViewController     //House description component
HouseCommentViewController  //House comment component

Der linke Job ist zusammengebaut. Der Kern der Montage ist

Jede Ansichtsregler unterstützt eine Möglichkeit, die Ansicht des Besitzers an das Root -Layout anzuhängen. Daher sollte die Aktivität über ein Root -Layout zum Ausfüllen aller Ansichten verwendet werden.

Der Java -Code ist so

 // 1、define ViewController instance
private ViewController < List < String >> mHousePhotoViewController ;
private ViewController < HouseDetail . Param > mHouseParamViewController ;
private ViewController < List < String >> mHouseCommentViewController ;
private ViewController < String > mHouseDescViewController ;

// 2、init instance 
mHousePhotoViewController = new HousePhotoViewController ( this );
mHouseParamViewController = new HouseParamViewController ( this );
mHouseDescViewController = new HouseDescViewController ( this );
mHouseCommentViewController = new HouseCommentViewController ( this );

// 3、attach view controller to activity root, usually the best choose for root is a vertical LinearLayout. 
mHousePhotoViewController . attachRoot ( mLlContainer );
mHouseParamViewControler . attachRoot ( mLlContainer );
mHouseDescViewControler . attachRoot ( mLlContainer );
mHouseCommentViewControler . attachRoot ( mLlContainer );

// 4 、mock get data 
getData ();

// 5、fill data to UI 

fillData ();

// 6、fill data to different view controller
private void fillData ( HouseDetail detail ) {
    mHousePhotoViewController . fillData ( detail . photos );
    mHouseParamViewController . fillData ( detail . param );
    mHouseDescViewController . fillData ( detail . desc );
    mHouseCommentViewController . fillData ( detail . comments );
}

Und jetzt hatte eine komplexe Benutzeroberfläche vier Komponenten geteilt, auf diese Weise befassen sich auf diese Weise nur mit der Eigentümerlogik.

Und wenn andere Aktivitäten oder Fragments die gleiche Komponente implementieren müssen, können Sie Code direkt wiederverwenden, nett!

Todo

• Lebenszyklus verwalten
• Unterstützen Sie eine Androidstudio -Templete, um den ViewController -Frame zu generieren

Autor

http://gudong.name

https://github.com/maoruibin

Lizenz

 Copyright 2016 咕咚

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.