HiveBrain v1.2.0
Get Started
← Back to all entries
patterncsharpMinor

Creating a masonry effect with varying height rectangles

Submitted by: @import:stackexchange-codereview··
0
Viewed 0 times
effectmasonryrectanglesheightcreatingwithvarying

Problem

The following is used to create a masonry effect with varying height rectangles. How can I simplify and make this more elegant in Unity?

private float startX = 0.0f;
private float startY = 0.0f;
private float posX = 0.0f;
private float posY = 0.0f;
private float prevWidth = 0;
private float prevHeight = 0;
private int index = 0;
private int currentCol = 0;

private void AddCard(int index, int col, float width, float height)
{
    GameObject goCard = (GameObject)GameObject.Instantiate(pfCard00);
    PackedSprite psCard = goCard.GetComponentInChildren();

    goCard.name = "QuestItemCard" + index.ToString();
    goCard.transform.parent = goCardContainer.transform;
    psCard.height = height;

    if (currentCol != col) 
    {
        posX += width;

        posY = 0;
        prevHeight = 0;
    }

    // placement
    posY += (prevHeight / 2) + (height / 2);
    goCard.transform.localPosition = new Vector3(startX + posX, startY - posY, goCard.transform.position.z);

    if (currentCol != col)
    {
        prevWidth = width;

        currentCol = col;
    }

    prevHeight = height;
}


Usage:

AddCard(0, 0, 100, 100);
AddCard(1, 0, 100, 100);
AddCard(2, 0, 100, 100);
AddCard(3, 0, 100, 200);

AddCard(4, 1, 100, 100);
AddCard(5, 1, 100, 100);
AddCard(6, 1, 100, 100);
AddCard(7, 1, 100, 200);

Solution

Consider splitting the code that increments the column into a separate method that can be called manually. Now you do not have to pass in column or row, and index can be incremented by the AddCard method. This greatly simplifies usage and allows you to make use of a for loop.

private float startX = 0.0f;
private float startY = 0.0f;
private float posX = 0.0f;
private float posY = 0.0f;
private float prevWidth = 0;
private float prevHeight = 0;
private int index = 0;
private int currentCol = 0;

private void IncreaseColumn()
{
    currentCol++;
    posX += width;
    posY = 0;
    prevHeight = 0;
}

private void AddCard(float width, float height)
{
    GameObject goCard = (GameObject)GameObject.Instantiate(pfCard00);
    PackedSprite psCard = goCard.GetComponentInChildren();

    goCard.name = "QuestItemCard" + index.ToString();
    goCard.transform.parent = goCardContainer.transform;
    psCard.height = height;

    // placement
    posY += (prevHeight / 2) + (height / 2);
    goCard.transform.localPosition = new Vector3(startX + posX, startY - posY, goCard.transform.position.z);

    prevWidth = width;
    prevHeight = height;

    index++;
}


Usage:

var columns = 2;
var rows = 4;

for(int x= 0; x< columns; x++)
{
    for(int y = 0; y<rows-1; y++)
    {
        AddCard(100, 100);
    }
    AddCard(100, 200);
    IncreaseColumn();
}

Code Snippets

private float startX = 0.0f;
private float startY = 0.0f;
private float posX = 0.0f;
private float posY = 0.0f;
private float prevWidth = 0;
private float prevHeight = 0;
private int index = 0;
private int currentCol = 0;


private void IncreaseColumn()
{
    currentCol++;
    posX += width;
    posY = 0;
    prevHeight = 0;
}

private void AddCard(float width, float height)
{
    GameObject goCard = (GameObject)GameObject.Instantiate(pfCard00);
    PackedSprite psCard = goCard.GetComponentInChildren<PackedSprite>();

    goCard.name = "QuestItemCard" + index.ToString();
    goCard.transform.parent = goCardContainer.transform;
    psCard.height = height;

    // placement
    posY += (prevHeight / 2) + (height / 2);
    goCard.transform.localPosition = new Vector3(startX + posX, startY - posY, goCard.transform.position.z);

    prevWidth = width;
    prevHeight = height;

    index++;
}
var columns = 2;
var rows = 4;

for(int x= 0; x< columns; x++)
{
    for(int y = 0; y<rows-1; y++)
    {
        AddCard(100, 100);
    }
    AddCard(100, 200);
    IncreaseColumn();
}

Context

StackExchange Code Review Q#37260, answer score: 5

Revisions (0)

No revisions yet.