ViewController

ViewController

Un controlador de vista administra un conjunto de vistas que constituyen una parte de la interfaz de usuario de su aplicación, tiene como objetivo hacer que la interfaz de usuario desarrolle el cambio más claro y flexible.

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

manifestación

Ventaja

• Haga componentes de desarrollo de la interfaz de usuario, resuelva el problema del código hinchado.
• Flexible, un componente puede usarse en más lugar.
• Fácil de usar, fácil Desarrollar.

Uso

Como buena práctica, le recomiendo que ejecute o vea el código de demostración directamente.

dependencia de la importación

Puede importar dependencia o copiar el archivo fuente a su proyecto directamente, hasta ahora, solo un archivo en este lib.

Agregue el repositorio de jitpack a su archivo de compilación

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

Agregar la dependencia

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

desarrollar componente

Al igual que esta imagen de demostración, deberíamos desarrollar cuatro componentes.

Ahora quiero desarrollar el componente de comentarios como una demostración, presentaré el punto por anotación de código.

 // 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 );
    }
}

Ahora, hemos terminado un componente de vista simple, y puede ver los componentes izquierdos implementados por código de demostración.

Ensamblar componente en la actividad

Hemos terminado cuatro componentes para la interfaz de usuario de detalles de la casa.

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

El trabajo de la izquierda se ensambla. El núcleo de ensamble es

Cada controlador de vista admite una forma de conectar la vista del propietario al diseño de la raíz, por lo que la actividad debe tener un uso de diseño de raíz para llenar todas las vistas.

El código Java es así

 // 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 );
}

Y ahora, una interfaz de usuario compleja había dividido cuatro componentes, de esta manera, cada componentes solo tratan con la lógica del propietario.

Y si otra actividad o fragmento tienen un mismo componente que necesita implementar, puede reutilizar el código directamente, ¡agradable!

HACER

• Gestionar el ciclo de vida
• Admite un AndroidStudio Templete para generar la marco ViewController

Autor

http://gudong.name

https://github.com/maoruibin

Licencia

 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.