Hi Deepak,
Yes, sorry, I forgot to mention that I hadn't added the drag functionality
to the scrollbar since I had put that on hold to focus on some other
issues. So you should see the functionality with the scroll wheel only
currently.
-Seth
On Wednesday, April 4, 2012 1:26:44 PM UTC-4, Deepak Singh wrote:
>
> Hi Seth,
>
> It works. Thanks.
>
> But the scrolling happens only through the mouse wheel movement, it does
> not scroll by dragging the bar in up and down direction.
> It simply gets dragged like an image.
>
>
> On Wed, Apr 4, 2012 at 8:53 AM, GWTter <seth....@gmail.com> wrote:
>
>> Hi Deepak,
>>
>> The most you should need to do is the following:
>>
>> AbsolutePanel absPanel = new AbsolutePanel();
>> for(int i = 0; i < 10; i++){
>> SimplePanel simp = new SimplePanel();
>> simp.setHeight("100px");
>> simp.setWidth("500px");
>> simp.getElement().getStyle().setBackgroundColor("green");
>> absPanel.add(simp);
>> }
>>
>> MyScrollPanel scrollPanel = new MyScrollPanel();
>> scrollPanel.setHeight("500px");
>> scrollPanel.setWidth("100px");
>>
>> scrollPanel.add(absPanel);
>>
>> RootPanel.get().add(scrollPanel);
>>
>> If the above code does not give you a green scrollable box then you
>> should recheck your code. With the code I sent you and the above code, you
>> should have a custom scroll bar (not native). You should at the very least
>> have the above code working. Hope this helps. Let me know.
>>
>> -Seth
>>
>>
>>
>> On Tuesday, April 3, 2012 1:59:33 PM UTC-4, Deepak Singh wrote:
>>>
>>> Hi Seth,
>>>
>>> I added the styles to myVerticalScrollBar. and added the entire page
>>> content to MyScrollpanel but still the default scrollbar is there.
>>>
>>> Its not overridden.
>>>
>>>
>>> On Mon, Apr 2, 2012 at 9:39 PM, GWTter <seth....@gmail.com> wrote:
>>>
>>>> Hi Deepak,
>>>>
>>>> Yes, you would need to apply some style to your scrollbar so that it at
>>>> least has width (or height if you were using the horizontal scrollbar). If
>>>> you look at the MyVerticalScrollBar constructor, the line
>>>> 'this.setStyleName("**verticalScrollBar")' sets the style for the
>>>> scrollbar. This style is not defined in the myScrollPanel.css as that CSS
>>>> file is only meant for the cornerpanel styling. You would need to define
>>>> the style "verticalScrollBar" in your main CSS file. For example:
>>>>
>>>> .verticalScrollBar{
>>>> width: 10px;
>>>> background: blue;
>>>> }
>>>>
>>>> Also, make sure that the content you're scrolling is within the
>>>> MyScrollPanel, since only content within the MyScrollPanel will have the
>>>> custom scroll bars, anything not within a CustomScrollPanel will still
>>>> default to the native implementation. Hope this helps.
>>>>
>>>> -Seth
>>>>
>>>> -Seth
>>>>
>>>>
>>>> On Monday, April 2, 2012 11:44:57 AM UTC-4, Deepak Singh wrote:
>>>>>
>>>>> Nothing more than what i sent you.
>>>>>
>>>>> I have just myScrollPanel.css as mention above.
>>>>>
>>>>> Could you pls guide me with css if i need to apply some css over
>>>>> vertical scrollbar?
>>>>>
>>>>> Thanks in advance
>>>>> Deepak
>>>>>
>>>>> On Mon, Apr 2, 2012 at 8:19 PM, GWTter <seth....@gmail.com> wrote:
>>>>>
>>>>>> Hi Deepak,
>>>>>>
>>>>>> This looks good to me. What style are you using for the vertical
>>>>>> scrollbar?
>>>>>>
>>>>>> And thanks for the repost.
>>>>>>
>>>>>> -Seth
>>>>>>
>>>>>>
>>>>>> On Sunday, April 1, 2012 3:50:12 PM UTC-4, Deepak Singh wrote:
>>>>>>>
>>>>>>> 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/**m****yScrollPanel.css")
>>>>>>> Style customScrollPanelStyle();
>>>>>>> }
>>>>>>> public MyScrollPanel(){
>>>>>>> super((MyScrollResources)GWT.**c****reate(MyScrollResources.**class)
>>>>>>> ****);
>>>>>>> this.setVerticalScrollbar(new MyVerticalScrollBar(),
>>>>>>> MyVerticalScrollBar.**getScrollB****arWidth());
>>>>>>> // this.setHorizontalScrollbar(**ne****w MyHorizontalScrollBar(),
>>>>>>> MyHorizontalScrollBar.**getScrol****lBarHeight());
>>>>>>> }
>>>>>>>
>>>>>>> }
>>>>>>>
>>>>>>>
>>>>>>> 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().**createDivElemen****t();
>>>>>>> setElement(this.elem);
>>>>>>> this.setStyleName("**verticalScr****ollBar");
>>>>>>> }
>>>>>>> public static int getScrollBarWidth(){
>>>>>>> return SCROLL_BAR_WIDTH;
>>>>>>> }
>>>>>>>
>>>>>>> @Override
>>>>>>> public int getMaximumVerticalScrollPositi******on() {
>>>>>>> return (int)(this.scrollWindowHeight-******this.scrollBarHeight);
>>>>>>> }
>>>>>>>
>>>>>>> @Override
>>>>>>> public int getMinimumVerticalScrollPositi******on() {
>>>>>>> return 0;
>>>>>>> }
>>>>>>>
>>>>>>> @Override
>>>>>>> public int getVerticalScrollPosition() {
>>>>>>> return (int)this.scrollBarPosition;
>>>>>>> }
>>>>>>> @Override
>>>>>>> public void setVerticalScrollPosition(int position) {
>>>>>>> this.scrollBarPosition = Math.floor(position*this.**scrol****
>>>>>>> lWindowPercentage);
>>>>>>> //make sure we don't go out of bounds with the scrollbar
>>>>>>> if(this.scrollBarPosition > this.**getMaximumVerticalScrollP****
>>>>>>> ositi**on()){
>>>>>>> this.scrollBarPosition = this.**getMaximumVerticalScrollP****ositi*
>>>>>>> *on();
>>>>>>> }
>>>>>>> this.elem.getStyle().setTop(**th****is.scrollBarPosition, Unit.PX);
>>>>>>> }
>>>>>>>
>>>>>>> @Override
>>>>>>> public HandlerRegistration addScrollHandler(ScrollHandler handler) {
>>>>>>> Event.sinkEvents(this.**getEleme****nt(), 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().**g****
>>>>>>> etOffsetHeight();
>>>>>>> this.scrollWindowPercentage = (height > 0) ? Math.min(1.0,this.**
>>>>>>> scrollWindow****Height/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 <seth....@gmail.com> 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 <
>>>>>>>>> deepaksingh...@gmail.com> 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 <seth....@gmail.com>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(),**MyVertic*
>>>>>>>>>>> *****alScrollBar.**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/**ms******g/google-web-toolkit/-/g-*
>>>>>>>>>>> *x4PrK******zgjoJ<https://groups.google.com/d/msg/google-web-toolkit/-/g-x4PrKzgjoJ>
>>>>>>>>>>> .
>>>>>>>>>>>
>>>>>>>>>>> To post to this group, send email to google-web-toolkit@**
>>>>>>>>>>> googlegroup******s.com <google-web-toolkit@googlegroups.com>.
>>>>>>>>>>> To unsubscribe from this group, send email to
>>>>>>>>>>> google-web-toolkit+**unsubscribe******@googlegroups.com<google-web-toolkit%2bunsubscr...@googlegroups.com>
>>>>>>>>>>> .
>>>>>>>>>>> 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/**ms****g/google-web-toolkit/-/**
>>>>>>>> ukY2df0****M7DsJ<https://groups.google.com/d/msg/google-web-toolkit/-/ukY2df0M7DsJ>
>>>>>>>> .
>>>>>>>>
>>>>>>>> To post to this group, send email to google-web-toolkit@**
>>>>>>>> googlegroup****s.com <google-web-toolkit@googlegroups.com>.
>>>>>>>> To unsubscribe from this group, send email to google-web-toolkit+**
>>>>>>>> unsubscribe****@googlegroups.com<google-web-toolkit%2bunsubscr...@googlegroups.com>
>>>>>>>> .
>>>>>>>> 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
>>>>>>>
>>>>>> --
>>>>>> 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/
>>>>>> **ms**g/google-web-toolkit/-/**K8QQ8IQ**D184J<https://groups.google.com/d/msg/google-web-toolkit/-/K8QQ8IQD184J>
>>>>>> .
>>>>>>
>>>>>> To post to this group, send email to google-web-toolkit@**googlegroup
>>>>>> **s.com <google-web-toolkit@googlegroups.com>.
>>>>>> To unsubscribe from this group, send email to google-web-toolkit+**
>>>>>> unsubscribe**@googlegroups.com<google-web-toolkit%2bunsubscr...@googlegroups.com>
>>>>>> .
>>>>>> 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
>>>>>
>>>> --
>>>> 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/-/**dWIvX4znogoJ<https://groups.google.com/d/msg/google-web-toolkit/-/dWIvX4znogoJ>
>>>> .
>>>>
>>>> To post to this group, send email to google-web-toolkit@**
>>>> googlegroups.com <google-web-toolkit@googlegroups.com>.
>>>> To unsubscribe from this group, send email to google-web-toolkit+**
>>>> unsubscr...@googlegroups.com<google-web-toolkit%2bunsubscr...@googlegroups.com>
>>>> .
>>>> 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
>>>
>> --
>> 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/-/3nb1iaz5z1IJ.
>>
>> To post to this group, send email to google-web-toolkit@googlegroups.com.
>> To unsubscribe from this group, send email to
>> google-web-toolkit+unsubscr...@googlegroups.com.
>> 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 view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/PxXnpCQWpGsJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
