Skocz do zawartości
daktarin

WebView - przeijanie do konkretnego id

    Rekomendowane odpowiedzi

    Cześć,

    jako html mam utworzoną mapkę świata. Idea: po kliknięciu na mapce jakiegoś kraju (ma on swoje id), mapka ma przewijać się do tego miejsca, w którym leży ten kraj.

    W html dałem kod funkcji:

    function scrollToElement(id) {
    	 
    		var elem = document.getElementById(id);
    		
    		var x = 0;
    		var y = 0;
    
    		while (elem != null) {
    			x += elem.offsetLeft;
    			y += elem.offsetTop;
    			elem = elem.offsetParent;
    		}
    		window.scrollTo(x, y);
    	}

    A w odpowiednim miejscu w javie (nawet na sztywno ustawiłem, że chodzi mi o element o id "PL").

     web_wiev.loadUrl("javascript:scrollToElement('PL')");

    Niestety, mapka się nie skroluje (czasmi się skroluje ale nie tam gdzie trzeba, czasami wcale się nie przewija).

    Macie jakieś pomysły?

    Pozdrawiam

    Marcin

    Udostępnij tę odpowiedź


    Odnośnik do odpowiedzi
    Udostępnij na innych stronach
    1 godzinę temu, Coders Lab napisał:

    @daktarin a jesteś pewny, że ten js działa poprawnie?

    Metoda

    scrollToElement

    na pewno się wykonuje. Dodałem do niej testowo wpis:

    function scrollToElement(id) {
    	 
    		var elem = document.getElementById(id);
    		elem.style.visibility = "hidden";
    
    		var x = 0;
    		var y = 0;
    
    		while (elem != null) {
    			x += elem.offsetLeft;
    			y += elem.offsetTop;
    			elem = elem.offsetParent;
    		}
    		window.scrollTo(x, y);
    	}

    i faktycznie element o id=PL znika. Problem jest więc z przewijaniem....

    Może to jakieś ustawienia WebView, które trzeba dodać?

    Udostępnij tę odpowiedź


    Odnośnik do odpowiedzi
    Udostępnij na innych stronach

    Jeśli nie ustawiasz, to powinieneś ustawić setJavaScriptEnabled na true (mogłem przekręcić lekko nazwę metody, bo piszę z tle) bo domyślnie jest to wyłączone. Przychodzi mi jeszcze do głowy ustawienie własnego WebViewClienta i tam nasłuchiwanie na parametry

    Wysłane z mojego FRD-L09 przy użyciu Tapatalka

    Udostępnij tę odpowiedź


    Odnośnik do odpowiedzi
    Udostępnij na innych stronach
    4 minuty temu, Coders Lab napisał:

    Jeśli nie ustawiasz, to powinieneś ustawić setJavaScriptEnabled na true (mogłem przekręcić lekko nazwę metody, bo piszę z tle) bo domyślnie jest to wyłączone. Przychodzi mi jeszcze do głowy ustawienie własnego WebViewClienta i tam nasłuchiwanie na parametry emoji12.png

    Mam takie ustawienia dla WebView:

    web_wiev = (WebView) findViewById(R.id.web_view);
    
            WebSettings webSettings = web_wiev.getSettings();
    
            wap = new WebAppInterface(this);
            web_wiev.addJavascriptInterface(wap, "Android");
            web_wiev.setWebViewClient(new WebViewClient());
    
            web_wiev.getSettings().setJavaScriptEnabled(true);
    
            web_wiev.getSettings().setSupportZoom(true);
            web_wiev.getSettings().setBuiltInZoomControls(true);
            web_wiev.getSettings().setDisplayZoomControls(false);
    
            web_wiev.getSettings().setLoadWithOverviewMode(true);
            web_wiev.getSettings().setUseWideViewPort(true);
    
            web_wiev.setInitialScale(1);

     

    Udostępnij tę odpowiedź


    Odnośnik do odpowiedzi
    Udostępnij na innych stronach
    Napisano (edytowane)

    @daktarin możesz jeszcze raz napisać jaki jest cel? Chcesz klikając na listView wykonać akcję na mapView, którą jest odpalenie JS, tak? Wybacz, ale czytam to jeszcze raz na spokojnie i nie mam pewności o co Ci chodzi :(

    Edytowane przez Coders Lab

    Udostępnij tę odpowiedź


    Odnośnik do odpowiedzi
    Udostępnij na innych stronach
    5 godzin temu, Coders Lab napisał:

    @daktarin możesz jeszcze raz napisać jaki jest cel? Chcesz klikając na listView wykonać akcję na mapView, którą jest odpalenie JS, tak? Wybacz, ale czytam to jeszcze raz na spokojnie i nie mam pewności o co Ci chodzi :(

    Już wyjaśniam.

    W aplikacji mam komponent WebView, do którego ładuję stronę WWW. Strona ta, przedstawia mapę polityczną świata. Każdy z krajów (w pliku html) posiada swoje id, np. Polska jest opisana tak:

    <path id="PL" title="Poland" class="land" fill="#cccccc"stroke="#00475d" stroke-width="1" onClick="reply_click(this.id)" d="M530.719,280.576L530.831,280.634L531.617,280.697L532.414,280.76L533.695,280.829L535.03,280.899L536.416,280.974L537.915,281.053L539.496,281.1L539.593,281.068L539.754,280.881L539.951,280.906L540.184,281.022L540.292,281.108L540.338,281.207L540.367,281.321L540.494,281.343L540.727,281.43L541.041,281.627L541.287,281.818L541.522,282.09L541.6,282.398L541.604,282.747L541.589,282.971L541.609,283.062L541.93,284.675L542.464,286.218L542.66,286.96L542.738,287.354L542.801,287.924L542.82,288.324L542.818,288.548L542.778,288.856L542.62,289.038L541.595,289.558L541.402,289.72L541.1,290.124L540.821,290.539L540.757,290.681L540.74,290.774L540.802,290.91L541.167,291.131L541.535,291.309L541.655,291.442L541.927,291.612L542.026,291.765L542.08,291.897L542.076,292.204L541.954,292.627L542.005,292.946L541.88,293.159L541.778,293.395L541.763,293.807L541.947,294.261L542.098,294.571L542.156,294.814L542.095,295.004L542.113,295.194L542.248,295.396L542.672,296.016L542.881,296.611L543.015,296.843L543.324,297.143L543.352,297.266L543.228,297.379L543.128,297.394L543.047,297.424L542.995,297.529L543.076,297.642L543.185,297.807L543.321,298.274L543.308,298.656L543.203,298.753L543.069,298.979L542.979,299.186L542.246,299.329L542.07,299.55L541.669,299.975L541.396,300.22L540.991,300.661L540.351,301.417L540.115,301.733L539.942,301.994L539.424,302.686L539.265,302.976L539.296,303.214L539.463,303.773L539.498,304.025L539.468,304.257L539.413,304.464L539.423,304.556L539.576,304.706L539.819,304.941L539.833,305.02L539.799,305.122L539.715,305.199L539.41,305.117L539.07,304.958L538.954,304.978L538.77,304.94L538.011,304.633L537.499,304.392L537.448,304.235L537.352,304.008L537.134,303.817L536.634,303.652L536.431,303.523L535.619,303.451L535.267,303.448L535.018,303.501L534.858,303.496L534.639,303.833L534.488,303.931L534.267,303.941L534.073,303.881L533.875,303.704L533.559,303.61L533.33,303.655L533.161,303.617L533.016,303.607L532.965,303.643L532.848,303.638L532.679,303.723L532.493,303.842L532.289,303.934L532.131,304.13L531.991,304.513L531.594,304.341L531.462,304.416L531.274,304.466L531.146,304.414L531.176,304.282L531.234,304.133L531.231,303.925L531.195,303.694L531.072,303.619L530.887,303.592L530.792,303.546L530.782,303.47L530.687,303.372L530.523,303.124L530.369,302.814L530.262,302.723L530.107,302.87L529.872,303.037L529.725,303.095L529.442,303.575L528.934,303.591L528.903,303.367L528.849,303.151L528.552,303.098L528.543,302.971L528.481,302.653L527.885,302.03L527.813,301.77L527.836,301.669L527.795,301.503L527.665,301.403L527.194,301.284L527.073,301.352L526.964,301.282L526.792,301.132L526.495,301.01L526.462,300.947L526.355,300.839L526.296,300.825L526.257,300.89L526.171,300.982L525.865,301.099L525.743,301.051L525.632,300.95L525.505,300.731L525.321,300.539L525.17,300.471L525.083,300.37L525.064,300.292L525.4,300.134L525.474,299.971L525.431,299.674L525.381,299.637L525.247,299.737L524.966,299.825L524.708,299.866L524.575,299.866L523.836,299.325L523.356,299.159L523.073,299.111L523.043,299.166L523.17,299.47L523.392,299.845L523.381,299.944L523.116,300.097L522.966,300.164L522.789,300.293L522.639,300.473L522.509,300.554L522.397,300.533L522.278,300.447L521.972,299.894L521.587,299.47L521.541,299.375L521.421,299.353L521.251,299.255L521.193,299.125L521.279,298.989L521.396,298.865L521.604,298.788L521.667,298.715L521.704,298.606L521.781,298.465L521.761,298.415L521.614,298.255L521.396,298.104L520.79,298.217L520.624,298.298L520.53,298.193L520.459,298.04L520.306,298.01L520.096,297.87L519.847,297.732L519.604,297.692L519.099,297.493L518.904,297.482L518.792,297.414L518.674,297.263L518.574,297.098L518.522,296.762L518.15,296.61L517.779,296.514L517.753,296.563L517.769,296.901L517.749,297.082L517.504,297.193L517.262,297.204L517.275,297.148L517.565,296.539L517.695,296.154L517.844,295.451L517.665,294.894L517.616,294.632L517.533,294.507L517.024,294.234L516.985,294.14L517.063,293.77L517.025,293.614L516.902,293.449L516.741,293.121L516.679,292.842L516.884,292.514L516.935,292.272L517.024,291.941L517.09,291.759L517.103,291.709L516.968,291.58L516.934,291.398L516.97,291.136L516.898,290.941L516.718,290.815L516.601,290.647L516.547,290.439L516.589,290.111L516.729,289.664L516.433,289.124L515.702,288.491L515.352,288.048L515.38,287.794L515.534,287.564L515.813,287.358L516.025,286.991L516.144,286.554L516.147,286.471L516.154,286.159L515.829,284.877L515.776,284.555L515.737,284.165L515.717,284.059L516.359,284.332L516.628,284.486L516.594,284.313L516.54,284.164L516.576,283.946L516.558,283.616L515.975,283.447L515.59,283.39L515.547,283.16L515.583,283.011L515.69,283.099L516.068,283.133L516.999,282.688L518.606,282.107L520.323,281.562L520.724,281.502L521.126,281.387L521.275,281.182L521.424,281.045L521.657,280.683L522.174,280.119L523.088,279.913L523.43,279.645L524.145,279.269L525.775,278.846L526.457,278.752L527.124,278.741L527.718,279.075L528.347,279.487L528.46,279.734L528.12,279.58L527.624,279.211L527.44,279.195L527.864,280.316L528.096,280.712L528.563,281.006L528.956,281.106L530.166,280.927L530.595,280.693z"/>

    Idea jest taka, że użytkownik aplikacji zgaduje gdzie leży dany kraj: widzi flagę tego kraju i musi na tej mapce politycznej, kliknąć właściwy kraj. Jeśli się pomyli, tzn kliknie inny kraj niż powinien, mapka z pliku html (wyświetlana w WebView) powinna przewinąć się do miejsca, w którym ten kraj leży (tak żeby user wiedział gdzie to państwo leży). I do tego właśnie jest mi potrzebne skrolowanie do wybranego elementu. I z tym nie mogę sobie poradzić....

    Udostępnij tę odpowiedź


    Odnośnik do odpowiedzi
    Udostępnij na innych stronach

    Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto

    Jedynie zarejestrowani użytkownicy mogą komentować zawartość tej strony.

    Zarejestruj nowe konto

    Załóż nowe konto. To bardzo proste!

    Zarejestruj się

    Zaloguj się

    Posiadasz już konto? Zaloguj się poniżej.

    Zaloguj się

    • Ostatnio przeglądający   0 użytkowników

      Brak zarejestrowanych użytkowników przeglądających tę stronę.

    x