Hi Seth,
I am posting my code here:
myScrollPanel.css
@CHARSET "ISO-8859-1";
.customScrollPanel{
}
.customScrollPanelCorner{
opacity: 0.0;
}
MyScrollPanel.java
public class MyScrollPanel extends CustomScrollPanel {
/**
* Extends the CustomScrollPanel Resources interface so that we can add our
own css file and still reuse the Resources and Style interfaces from
CustomScrollPanel
* @author SL
*
*/
public interface MyScrollResources extends Resources{
@Source("com/pdstechi/client/myScrollPanel.css")
Style customScrollPanelStyle();
}
public MyScrollPanel(){
super((MyScrollResources)GWT.create(MyScrollResources.class));
this.setVerticalScrollbar(new MyVerticalScrollBar(),
MyVerticalScrollBar.getScrollBarWidth());
// this.setHorizontalScrollbar(new MyHorizontalScrollBar(),
MyHorizontalScrollBar.getScrollBarHeight());
}
}
MyVerticalScrollBar.java
public class MyVerticalScrollBar extends Widget implements
VerticalScrollbar {
private double scrollBarHeight = 0.0;
private double scrollBarPosition = 0.0;
private double scrollWindowPercentage = 1.0;
private double scrollWindowHeight = 0;
private int totalScrollContentHeight = 0;
private static final int SCROLL_BAR_WIDTH = 10;
private Element elem;
public MyVerticalScrollBar(){
this.elem = Document.get().createDivElement();
setElement(this.elem);
this.setStyleName("verticalScrollBar");
}
public static int getScrollBarWidth(){
return SCROLL_BAR_WIDTH;
}
@Override
public int getMaximumVerticalScrollPosition() {
return (int)(this.scrollWindowHeight-this.scrollBarHeight);
}
@Override
public int getMinimumVerticalScrollPosition() {
return 0;
}
@Override
public int getVerticalScrollPosition() {
return (int)this.scrollBarPosition;
}
@Override
public void setVerticalScrollPosition(int position) {
this.scrollBarPosition = Math.floor(position*this.scrollWindowPercentage);
//make sure we don't go out of bounds with the scrollbar
if(this.scrollBarPosition > this.getMaximumVerticalScrollPosition()){
this.scrollBarPosition = this.getMaximumVerticalScrollPosition();
}
this.elem.getStyle().setTop(this.scrollBarPosition, Unit.PX);
}
@Override
public HandlerRegistration addScrollHandler(ScrollHandler handler) {
Event.sinkEvents(this.getElement(), Event.ONSCROLL);
return this.addHandler(handler, ScrollEvent.getType());
}
@Override
public Widget asWidget() {
return this;
}
@Override
public int getScrollHeight() {
return this.totalScrollContentHeight;
}
@Override
public void setScrollHeight(int height) {
//TODO: HAVE TO FIND A WAY TO GET THE SIZE OF THE CORNER BOX, OR BETTER
YET, IF THE CORNER BOX IS ENABLED BECAUSE THE HORIZONTAL SCROLL BAR IS ALSO
VISIBLE
this.totalScrollContentHeight = height;
this.scrollWindowHeight = this.elem.getParentElement().getOffsetHeight();
this.scrollWindowPercentage = (height > 0) ?
Math.min(1.0,this.scrollWindowHeight/height):1.0;
this.scrollBarHeight =
Math.max(SCROLL_BAR_WIDTH,Math.floor(this.scrollWindowHeight*this.scrollWindowPercentage));
this.elem.getStyle().setHeight(this.scrollBarHeight, Unit.PX);
}
}
All these classes are in my client package.
I just want that browser default varticalscrollbar should change its look.
Also, I am reposting the original msg with attached code again to the group.
Thanks
Deepak
On Sun, Apr 1, 2012 at 11:01 PM, GWTter <[email protected]> wrote:
> Hi Deepak,
>
> You would have to post your code. Did you make sure to style your vertical
> scrollbar, create the MyScrollPanel and set its verticalScrollbar with the
> one you created? In the code I sent you the vertical scrollbar has a width
> of 10px, you should style the vertical scrollbar to be within that width.
>
> Also, I can't seem to find the repost of the original message with the
> attached code I sent you anywhere in this thread, am I looking in the wrong
> place. Thanks.
>
> -Seth
>
>
> On Saturday, March 31, 2012 4:27:42 PM UTC-4, Deepak Singh wrote:
>>
>> Hi Seth,
>>
>> I copied your classes and css in my client package. It compiled fine.
>> When i run the applicatio in dev mode, the browser default scrollbar is
>> not overridden.
>>
>> It is same as default.
>>
>> What can i do to override the native one ?
>>
>> On Sun, Apr 1, 2012 at 1:05 AM, Deepak Singh <[email protected]>wrote:
>>
>>> Thank you Seth. I would give it a try.
>>>
>>> Thats already reposted and is in the thread.
>>>
>>> Thanks
>>> Deepak
>>>
>>>
>>> On Sat, Mar 31, 2012 at 10:59 PM, GWTter <[email protected]> wrote:
>>>
>>>> Hi Deepak,
>>>>
>>>> This is all that's in the css file as the only important class is the
>>>> corner that I've set to be transparent:
>>>>
>>>> .customScrollPanel{
>>>> }
>>>>
>>>> .customScrollPanelCorner{
>>>> opacity: 0.0;
>>>> }
>>>>
>>>> As for how to use the vertical scroll bar to override the native (or
>>>> the transparent one CustomScrollPanel uses by default) if you look at the
>>>> line
>>>>
>>>> "this.setVerticalScrollbar(new MyVerticalScrollBar(),**
>>>> MyVerticalScrollBar.**getScrollBarWidth());"
>>>>
>>>> in MyScrollPanel class in the code I sent, this is what actually does
>>>> the overriding. This method is available on the CustomScrollPanel class
>>>> which MyScrollPanel extends.
>>>>
>>>> Hope that answers your question. Also can you please repost my initial
>>>> reply with the code to this thread, it would save me the time of having to
>>>> rewrite it :) Thanks.
>>>>
>>>>
>>>> -Seth
>>>>
>>>> --
>>>> You received this message because you are subscribed to the Google
>>>> Groups "Google Web Toolkit" group.
>>>> To view this discussion on the web visit https://groups.google.com/d/**
>>>> msg/google-web-toolkit/-/g-**x4PrKzgjoJ<https://groups.google.com/d/msg/google-web-toolkit/-/g-x4PrKzgjoJ>
>>>> .
>>>>
>>>> To post to this group, send email to google-web-toolkit@**
>>>> googlegroups.com <[email protected]>.
>>>> To unsubscribe from this group, send email to google-web-toolkit+**
>>>> [email protected]<google-web-toolkit%[email protected]>
>>>> .
>>>> For more options, visit this group at http://groups.google.com/**
>>>> group/google-web-toolkit?hl=en<http://groups.google.com/group/google-web-toolkit?hl=en>
>>>> **.
>>>>
>>>
>>>
>>>
>>> --
>>> Deepak Singh
>>>
>>
>>
>>
>> --
>> Deepak Singh
>>
> --
> You received this message because you are subscribed to the Google Groups
> "Google Web Toolkit" group.
> To view this discussion on the web visit
> https://groups.google.com/d/msg/google-web-toolkit/-/ukY2df0M7DsJ.
>
> To post to this group, send email to [email protected].
> To unsubscribe from this group, send email to
> [email protected].
> For more options, visit this group at
> http://groups.google.com/group/google-web-toolkit?hl=en.
>
--
Deepak Singh
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
