The slider value doesn't correspond to the local position.x of the slider's child

Hi! I’m making “League Road”, you can see on screenshot below how it looks like.


The problem is, when i set slider value, it isn’t corresponds to points on my road. Slider value range 0-10000.

Slider value set to 100:

Slider value set to 800:

Slider value set to 3200:


Gap keeps growing


How I set points:
Points are childs of slider, slider is child of content


I’m setting content length like this:

content.sizeDelta = new Vector2(contentLength * contentLengthMultiplier, content.sizeDelta.y);

Then, I instantiate my points:

Transform point = Object.Instantiate(roadPointPrefab, parent);
point.localPosition = new Vector3(position * contentLengthMultiplier, heightOffset, 0);

Full code:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using TMPro;

[System.Serializable]
public class RoadPoint
{
    [SerializeField] private Transform roadPointPrefab;
    [SerializeField] private Transform roadPointScorePrefab;
    [SerializeField] private Transform roadPointInfoPrefab;
    [SerializeField] private float position;

    [SerializeField] private Sprite sprite;
    private string scoreText;
    [SerializeField] private string textInfo;

    public Transform InstantiatePoint(Transform parent, float contentLengthMultiplier,
        float heightOffset, float scoreHeightOffset, float infoHeightOffset)
    {
        Transform point = Object.Instantiate(roadPointPrefab, parent);
        point.localPosition = new Vector3(position * contentLengthMultiplier, heightOffset, 0);

        Transform scorePoint = Object.Instantiate(roadPointScorePrefab, parent);
        scorePoint.localPosition = new Vector3(position * contentLengthMultiplier, scoreHeightOffset, 0);
        scoreText = position.ToString();
        scorePoint.GetComponent<TMP_Text>().text = scoreText;

        Transform infoPoint = Object.Instantiate(roadPointInfoPrefab, parent);
        infoPoint.localPosition = new Vector3(position * contentLengthMultiplier, infoHeightOffset, 0);
        infoPoint.GetComponent<TMP_Text>().text = textInfo;

        if (sprite != null)
        {
            GameObject imageObject = new GameObject("PointImage");
            imageObject.transform.SetParent(point, false);
            Image pointImage = imageObject.AddComponent<Image>();
            pointImage.sprite = sprite;
            pointImage.transform.localPosition = Vector3.zero;
        }

        return point;
    }
}

public class LeagueRoad : MonoBehaviour
{
    [SerializeField] RoadPoint[] roadPoints;

    [SerializeField] private RectTransform content;
    [SerializeField] private RectTransform slider;
    [SerializeField] internal float contentLength;

    [SerializeField] private float heightOffset;
    [SerializeField] private float scoreHeightOffset;
    [SerializeField] private float infoHeightOffset;

    [SerializeField] private float contentLengthMultiplier;

    void Awake()
    {
        content.sizeDelta = new Vector2(contentLength * contentLengthMultiplier, content.sizeDelta.y);
        Debug.Log(content.sizeDelta.x);

        foreach (var roadPoint in roadPoints)
        {
            roadPoint.InstantiatePoint(slider, contentLengthMultiplier,
                heightOffset, scoreHeightOffset, infoHeightOffset);
        }
    }
}

Fixed it!

  1. Make sure Fill Area Left and Right are 0

  1. When setting content.sizeDelta add slider margins to its length

    content.sizeDelta = new Vector2(contentLength * contentLengthMultiplier + (210 * 2), content.sizeDelta.y);