continue to work on UI

This commit is contained in:
2024-09-29 14:42:07 +03:00
parent 20e145c091
commit 5b1e71306b
7 changed files with 128 additions and 25 deletions
+39 -17
View File
@@ -1,5 +1,4 @@
.container
{
.container {
display: flex;
flex-direction: row;
height: 50px;
@@ -9,28 +8,51 @@
flex-grow: 1;
height: 50px;
max-width: 40px;
background-image: url("project://database/Assets/Characters/pics/Sophie.png?fileID=2800000&guid=4999eb6bfdcacae48a7ed2020bd489d0&type=3#Sophie");
background-image: url('"project://database/Assets/Characters/pics/Sophie.png?fileID=2800000&guid=4999eb6bfdcacae48a7ed2020bd489d0&type=3#Sophie"');
}
.panel {
display: flex;
flex-grow: 2;
-unity-background-image-tint-color: rgba(2, 2, 2, 0.64);
background-color: rgba(0, 0, 0, 0.75);
align-items: auto;
height: 40px;
height: 25px;
justify-content: left;
flex-direction: row;
align-items: flex-start;
}
.progress-bar-container {
width: 100px;
height: 7px;
background-color: rgba(255, 255, 255, 0.3);
border-radius: 10px;
overflow: hidden;
.top-elements-block {
flex: 1
display: flex;
align-items: flex-start;
justify-content: left;
flex-direction: row;
}
.progress-bar-fill {
width: 50%;
height: 100%;
background-color: #00FF00;
border-radius: 10px 0 0 10px; /* Rounded corners on the left side */
.stat-container {
margin-left: 10px;
display: flex;
align-items: center;
flex-direction: row;
align-self: center;
}
.progress-icon {
display: inline-block;
width: 25px;
height: 20px;
align-items: center;
align-self: center;
flex-direction: row;
}
.top-bar-label{
color: rgb(255, 255, 255);
align-self: center;
-unity-text-align: middle-left;
}
.justify-center{
justify-content: center;
align-self: center;
}
+26 -3
View File
@@ -2,9 +2,32 @@
<Style src="project://database/Assets/UI/inGameHud.uss?fileID=7433441132597879392&amp;guid=b1b33e86ffa27d840968609d368bc1ac&amp;type=3#inGameHud" />
<ui:VisualElement class="container">
<ui:VisualElement name="CharacterImage" class="player-image" style="background-image: url(&quot;project://database/Assets/Characters/pics/Sophie.png?fileID=2800000&amp;guid=4999eb6bfdcacae48a7ed2020bd489d0&amp;type=3#Sophie&quot;);" />
<ui:VisualElement name="Panel" class="panel">
<ui:VisualElement name="VisualElement" class="progress-bar-container">
<ui:VisualElement class="progress-bar-fill" name="progressFill" />
<ui:VisualElement name="TopPanel" class="panel">
<ui:VisualElement name="Stats" class="top-elements-block">
<ui:VisualElement name="EnergyProgress" template="progressBar" class="stat-container">
<Style src="project://database/Assets/UI/progressBar.uss?fileID=7433441132597879392&amp;guid=755fc3f2b04b5014794dec9f2787b86e&amp;type=3#progressBar" />
<ui:VisualElement name="icon" class="progress-icon" style="background-image: url(&quot;project://database/Assets/3dAssets/Textures/EnergyIcon.png?fileID=2800000&amp;guid=dfe1a973babd6cc4bb1a418ed2f3562e&amp;type=3#EnergyIcon&quot;);" />
<ui:VisualElement name="progressBarContainer" class="progress-bar-container">
<ui:VisualElement name="progressFill" class="progress-bar-fill" />
</ui:VisualElement>
</ui:VisualElement>
<ui:VisualElement name="HungerProgress" template="progressBar" class="stat-container">
<Style src="project://database/Assets/UI/progressBar.uss?fileID=7433441132597879392&amp;guid=755fc3f2b04b5014794dec9f2787b86e&amp;type=3#progressBar" />
<ui:VisualElement name="icon" class="progress-icon" style="background-image: url(&quot;project://database/Assets/3dAssets/Textures/FoodIcon.png?fileID=2800000&amp;guid=bc479ad3f781c4540995d023a62d8c1d&amp;type=3#FoodIcon&quot;);" />
<ui:VisualElement name="progressBarContainer" class="progress-bar-container">
<ui:VisualElement name="progressFill" class="progress-bar-fill" />
</ui:VisualElement>
</ui:VisualElement>
<ui:VisualElement name="MoneyPanel" class="stat-container">
<ui:VisualElement name="icon" style="background-image: url(&quot;project://database/Assets/3dAssets/Textures/MoneyIcon.png?fileID=2800000&amp;guid=e46ce1f51442ea448bc1091e8d1367d9&amp;type=3#MoneyIcon&quot;); height: 15px; width: 30px; max-height: 15px;" />
<ui:Label text="100000" class="top-bar-label" />
</ui:VisualElement>
</ui:VisualElement>
<ui:VisualElement name="LocationInfo" class="top-elements-block justify-center">
<ui:Label text="Nowhere" class="top-bar-label justify-center" />
</ui:VisualElement>
<ui:VisualElement name="TimeInfo" class="top-elements-block justify-center">
<ui:Label text="Nowhere" class="top-bar-label" />
</ui:VisualElement>
</ui:VisualElement>
</ui:VisualElement>
+24
View File
@@ -0,0 +1,24 @@
using UnityEngine;
using UnityEngine.UIElements;
public class ProgressBar : MonoBehaviour
{
public VisualElement progressBarFill;
private float progress = 0f;
void Start()
{
var root = GetComponent<UIDocument>().rootVisualElement;
progressBarFill = root.Q<VisualElement>("progressFill");
}
void Update()
{
// Update progress value here
progress += Time.deltaTime * 0.1f; // Example increment
progress = Mathf.Clamp01(progress);
// Update the width of the progress bar fill
progressBarFill.style.width = new Length(progress * 100, LengthUnit.Percent);
}
}
+2
View File
@@ -0,0 +1,2 @@
fileFormatVersion: 2
guid: 06b9647c1a0866f42968471850af5480
+15
View File
@@ -0,0 +1,15 @@
.progress-bar-container {
width: 80px;
position: relative;
height: 7px;
background-color: rgba(255, 255, 255, 0.3);
border-radius: 10px;
overflow: hidden;
}
.progress-bar-fill {
width: 50%;
height: 100%;
background-color: #00FF00;
border-radius: 10px 0 0 10px; /* Rounded corners on the left side */
}
+7
View File
@@ -0,0 +1,7 @@
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" editor-extension-mode="False">
<Style src="project://database/Assets/UI/progressBar.uss?fileID=7433441132597879392&amp;guid=755fc3f2b04b5014794dec9f2787b86e&amp;type=3#progressBar" />
<ui:VisualElement name="ImageContainer" />
<ui:VisualElement name="VisualElement" class="progress-bar-container">
<ui:VisualElement name="progressFill" class="progress-bar-fill" />
</ui:VisualElement>
</ui:UXML>
+10
View File
@@ -0,0 +1,10 @@
fileFormatVersion: 2
guid: d1f095cbac9cb9c4a8df0d12f5567b30
ScriptedImporter:
internalIDToNameTable: []
externalObjects: {}
serializedVersion: 2
userData:
assetBundleName:
assetBundleVariant:
script: {fileID: 13804, guid: 0000000000000000e000000000000000, type: 0}