NGUI learning of Unity plug-in (7) -- ScrollView (Panel), nguiscrollview

NGUI learning of Unity plug-in (7) -- ScrollView (Panel), nguiscrollview

The ScrollView introduced today refers to the Example project: Scroll View (Panel) in NGUI (3.6.8 ).

Create a UI Root according to NGUI of the Unity plug-in (2), Create a Scroll View under the UI Root, and select the menu NGUI-> Create-> Scroll View

Then, set some parameters in the Inspector window.

Movement: Scroll Vertical portrait or horizontal landscape.

Scroll Bars can be used to add a vertical or horizontal Scroll bar control (not added in this project at the moment ).

In the UI Panel, you can set the Scroll display range. In Clipping, you can select Soft Clip and set the Size. In the preview window, the highlighted purple is the display area of the scroll Panel.

In the Hierarchy window, select Scroll View, choose NGUI> Create> Grid from the menu, and then select the created Grid in the Hierarchy window, choose Component> NGUI> Interaction> Center Scroll View on Child.

Set the height and width of a single Item Cell, and set the Arrangment to vertical or horizontal.

Create a ListItem Prefab. The Height and Width must be consistent with the Cell Width and Cell Height of the Grid above. You need to add two important scripts and Box Collider to ListItem, you can implement the scroll effect and automatically adjust the scroll position after the Item is clicked. To add the script, choose comatrix onent> NGUI> Interaction> Drag Scroll View and comatrix onent> NGUI> Interaction> Center Scroll View on Click from the menu. After adding Box Collider, check Is Trigger.

Add multiple listitems under UIGrid in the Hierarchy window, and click Run to view the scroll effect. Click a single Item to automatically adjust the position of the scroll.

The following describes how to dynamically adjust the number of items in the Scroll View.

Add two buttons, one AddButton and one DelButton, and create a ListViewTest script.

The ListViewTest code is as follows:

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 preset
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 the new preset under the Panel object
O. transform. parent = grid. transform;
// The following code is very important because the rotation and scaling coefficients are automatically modified when the preset is created,
// I don't know why it was automatically modified, so I assigned it a new value.
O. transform. localPosition = Vector3.zero;
O. transform. localScale = new Vector3 (1, 1, 1 );
// Refresh the listView after the list is added
Grid. repositionNow = true;
}


Void DelAllItems (){
Foreach (Transform trans in grid. transform ){
Destroy (trans. gameObject );
}
Grid. repositionNow = true;
}
}

Bind the script to the UI Root and run the game. Click Add to Add items. Click Del to delete all items.

The NGUI list of Unity cannot be answered.

Is your subpanel scrollview?

[URGENT] (unity3d) What is the adjust by DPI under the ngui ui root ??

Answers on the official website forum:
Adjust by DPI experimental option will scale your UI Root on top of its ordinary scaling. that is, you 'd design your UI in Pixel Perfect mode and on iPad Retina you 'd get the screen size that matches the non-retina resolution. it basically takes pixel density into consideration, making your UI be based on screen DPI, not just screen resolution.
Simply put, different display devices have different DPI. DPI is used to measure the pixel density. For example, an android device with a 3.7-inch resolution of 1024*768 is
Sqrt (1024 ^ 2 + 768 ^ 2)/3.7
The smaller the screen, the larger the DPI. The larger the Resolution, the larger the DPI.
NGUI can dynamically match other DPI screens, and you only need to match the dpi of the development machine. NGUI matches the DPI of the target device through internal computation (for example, stretching/narrowing controls), but there are still many problems in actual use.