Unity Plugin Ngui Learning (7)--scrollview (Panel)

The ScrollView introduced today is the example project in Ngui (3.6.8): Scroll View (Panel).

First, follow the unity plugin's Ngui Learning (2) Create a UI Root. Then create a Scroll view below the UI root, select menu Ngui->create->scroll view

Then make some parameter settings in the Inspector form

Movement set the scrolling vertical portrait or horizontal landscape.

Scroll bars can add vertical or horizontal scroll bar controls (not included in this project for the moment).

The UI panel is able to set the display range for scrolling. Clipping can choose soft Clip. Sets the size of sizes in the preview form. You can see the bright purple is the display area of the scrolling panel.

In the Hierarchy form, select scroll View, select Ngui->create->grid in the menu, and then select the Grid you just created in the hierarchy form. On the menu Component->ngui->interaction->center Scroll View on the child.

Sets the height and width of a single item cell. Arrangment to set portrait or landscape orientation.

Then make a listitem prefab, the height and width should be consistent with the cell width and cell height of the grid above. Need to add 2 important scripts and box Collider to ListItem. The ability to scroll, and the item click to adjust the scroll position on its own initiative.

Script to join. Select Commponent->ngui->interaction->drag Scroll View and commponent->ngui->interaction->center from the menu Scroll View on Click. When Box Collider is added, check the is Trigger.

Then, under Uigrid of the hierarchy form, add multiple ListItem. Then click on Execute. You can see the scrolling effect. Click on a single item and the scrolling will take its own initiative to adjust the position.

The following describes the code that dynamically adjusts the item count for scroll view.

First add 2 buttons, one AddButton, one Delbutton. Then create a listviewtest script.

Listviewtest code such as the following:

Using Unityengine;
Using System.Collections;


public class Listviewtest:monobehaviour {


Private Gameobject ScrollView;
Private Uigrid grid;
Private UIButton addbtn, delbtn;


Use this for initialization
void Start () {
ScrollView = Gameobject.find ("Scroll View");
Grid = Scrollview.getcomponentinchildren <UIGrid> ();
ADDBTN = Gameobject.find ("AddButton"). Getcomponent<uibutton> ();
DELBTN = Gameobject.find ("Delbutton"). Getcomponent<uibutton> ();
Eventdelegate.add (Addbtn.onclick, AddItem);
Eventdelegate.add (Delbtn.onclick, Delallitems);
}

Update is called once per frame
void Update () {

}


void AddItem () {
int count = Grid.transform.childCount + 1;
Clone presets
Gameobject o = (gameobject) Instantiate (Resources.load ("Prefabs/listitem"));
UILabel label = o.getcomponentinchildren<uilabel> ();
Set a unique name for each preset
Label.text = "item" + Count;
Place a new preset below the Panel object
O.transform.parent = Grid.transform;
The following code is very important. Is that the coefficients of the rotation scale are actively altered when you create a preset.
I don't know why I have to change it myself, so I'm assigning it again
O.transform.localposition = Vector3.zero;
O.transform.localscale = new Vector3 (1, 1, 1);
Used to refresh the ListView after the list has been added
Grid.repositionnow = true;
}


void Delallitems () {
foreach (Transform trans in grid.transform) {
Destroy (Trans.gameobject);
}
Grid.repositionnow = true;
}
}

Bind the script after the UI root to execute the game, click AddButton, be able to add item, click Delbutton, will delete all the item.

Unity Plugin Ngui Learning (7)--scrollview (Panel)