Clipping label to parent visual element

Hello,

I am trying to figure out how to clip a Label control to its parent container. For example:


I am rendering a bunch of prefab previews and on top of the prefab preview, I am drawing a label which represents the name of the prefab.

The code that creates the preview controls is:

Code (CSharp):

1.                    
2. var previewContainer = new VisualElement();
3. previewContainer.style.flexDirection = FlexDirection.Column;
4. previewContainer.style.flexWrap = Wrap.NoWrap;
5. previewContainer.style.SetBorderWidth(1.0f);
6. previewContainer.style.SetBorderColor(Color.black);
7.  
8. var previewImage = new VisualElement();
9. previewImage.style.width = prefabPreviewSize;
10. previewImage.style.height = prefabPreviewSize;
11. previewImage.style.backgroundImage = PrefabPreviewFactory.Get.Create(prefabItem.Prefab.UnityPrefab, new PrefabPreviewFactory.PreviewConfig() { });
12. previewImage.tooltip = prefabItem.Prefab.UnityPrefab.name;
13. previewContainer.Add(previewImage);
14.  
15. var previewLabel = new Label();
16. previewLabel.text = prefabItem.Prefab.UnityPrefab.name;
17. previewLabel.style.unityFontStyleAndWeight = FontStyle.Bold;
18. previewImage.Add(previewLabel);                
19.  
20. var toolbar = new Toolbar();
21. previewContainer.Add(toolbar);
22.  

So the preview is composed of a parent preview container, which contains a preview image. The preview image contains the preview label. How can I clip the preview label to the previewImage control?

Thanks,
Andrew

 

Wonderful! Works perfectly Thank you!