2017-12-24 6 views
0

나는 CSS를 사용하여 porgressbar 정의하지만 난 .bar에 대한 -fx-pref-width을 사용하는 경우는하지 않았다 했네 내 ​​CSS입니다 :어떻게 진행 막대의 가로 너비를 변경할 수 있습니까?

.super-fx-progress-bar { 

    -fx-background-color: transparent; 

} 

.super-fx-progress-bar .track{ 

    -fx-background-color: transparent; 
    -fx-border-radius:20; 
    -fx-background-radius:20; 

} 

.super-fx-progress-bar .bar { 

    -fx-background-color: #0057e7,transparent,#6666ff; 
    -fx-background-insets: 1 1 1 3, 1 1 1 1, 1 1 2 3; 
    -fx-border-radius:20; 
    -fx-background-radius:20; 
    -fx-pref-width:2 

    /*What should i add to minimize width of bar when its value is indeterminated*/ 

} 
+0

"작동하지 않았다?" 누구나 테스트 할 수 있도록 필요한 모든 코드를 추가하고 어떻게 작동하지 않았는 지에 대해 자세히 설명해 줄 수 있습니까? – Atsch

+0

정확히 무엇을 원하는지 더 설명 할 수 있습니까? –

답변

0

당신은 추가하여이 작업을 수행 할 수 있습니다 : (

-fx-indeterminate-bar-length:value; 

클래스 progressbar에 당신 used .super-fx-progress-bar) :

다른 결과를 표시하기 위해이 작업을 수행했습니다.

제 1 호 양식 :

.super-fx-progress-bar { 

    -fx-background-color: transparent; 
    -fx-indeterminate-bar-animation-time:1.0; 
    -fx-indeterminate-bar-flip:true; 
    -fx-indeterminate-bar-escape:true; 
    -fx-indeterminate-bar-length:20; 
    -fx-min-height:5; 


} 

두 번째 스타일은 :

.super-fx-progress-bar { 

    -fx-background-color: transparent; 
    -fx-indeterminate-bar-animation-time:1.0; 
    -fx-indeterminate-bar-flip:true; 
    -fx-indeterminate-bar-escape:true; 
    -fx-indeterminate-bar-length:60; 
    -fx-min-height:5; 


} 

See the results