Can't get the button/LED flash to work on the Pico

Anvil Q&A
1

What I’m trying to do:
Follow the beginners tutorial
What I’ve tried and what’s not working:
I build the button, copy the code into main along with
Code Sample:
def button_1_click(self, **event_args):

"""This method is called when the button is clicked"""
anvil.server.call('pico_fn', 18)

this is a formatted code snippet.

paste your code between ```

When I hit run and click the button, nothing happens. The Pico says its connected.

Having a hard time following the tutorial. I'm not sure I put the button together right.
2

Did you also hook up the button click events in the designer pane?

3

I dragged the button over to the template. I had a lot of trouble following how to add the attributes needed to the button, so I may have missed something critical. Can you explain the steps?

4

Maybe someone can tell me where I am going wrong. I am confused by many things in the Pico tutorial. If I unplug & replug my pico the code runs and the lights start blinking in a repeating code. Clicking run on the template has no seeming effect. The tutorial seems to indicate that if I hit CNL-C I will be able to see something going on, but it never connects. If I halt execution and hit run I get lots of error messages that repeat:
MPY: soft reboot
<CYW43 STA up 192.168.0.109>
Setting system time…
System time set to 1710364068
<CYW43 STA up 192.168.0.109>
Connecting to Anvil…
Connected
Exception in uplink reconnection loop:
Traceback (most recent call last):
File “anvil/pico.py”, line 154, in _connect_async
File “anvil/pico.py”, line 118, in _connect
Exception: Connection failed: {‘error’: ‘Incorrect uplink key’}
Connecting to Anvil…
Exception in uplink reconnection loop:
Traceback (most recent call last):
File “anvil/pico.py”, line 154, in _connect_async
File “anvil/pico.py”, line 112, in _connect
File “async_websocket_client.py”, line 105, in handshake
File “async_websocket_client.py”, line 99, in send_header
OSError: -28928
Connecting to Anvil…
Connected
Exception in uplink reconnection loop:
Traceback (most recent call last):
File “anvil/pico.py”, line 154, in _connect_async
File “anvil/pico.py”, line 118, in _connect
Exception: Connection failed: {‘error’: ‘Incorrect uplink key’}
Connecting to Anvil…

Here is the HTML code:

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" rel="preload" as="font" crossorigin="anonymous">

<div class="structure">
  <div class="app-bar" anvil-drop-container=".anvil-container" anvil-drop-redirect=".placeholder">
    <a class="sidebar-toggle" anvil-if-slot-empty="top-left-btn" anvil-hide-if-slot-empty="left-nav" anvil-drop-slot="top-left-btn" href="javascript:void(0)"><i class="fa fa-bars"></i></a>
    <a class="sidebar-toggle anvil-designer-only" anvil-if-slot-empty="top-left-btn" anvil-if-slot-empty="left-nav" anvil-drop-slot="top-left-btn"><i class="fa fa-blank"></i></a>
    <div class="top-left-btn" anvil-slot="top-left-btn"></div>
    <div class="title" anvil-slot="title">
      <div class="placeholder anvil-designer-only" anvil-if-slot-empty="title" anvil-drop-here>Drop title here</div>
    </div>
    <div class="app-bar-nav" anvil-slot="nav-right">
      <div class="placeholder anvil-designer-only" anvil-if-slot-empty="nav-right" anvil-drop-here>Drop a FlowPanel here</div>
    </div>
    <div style="clear:both"></div>
  </div>

  <div class="nav-holder">
    <div class="left-nav anvil-measure-this" anvil-slot-repeat="left-nav" anvil-drop-container=">.anvil-container">
    </div>
    <div class="left-nav-placeholder anvil-designer-only" anvil-if-slot-empty="left-nav" anvil-drop-slot="left-nav">
      <div class="prompt">To add a sidebar, drop a ColumnPanel here.</div>
    </div>

    <div class="content">
      <div anvil-slot-repeat="default" class="anvil-measure-this"></div>
      <div class="placeholder drop-here" anvil-if-slot-empty="default" anvil-drop-slot="default">Drop a ColumnPanel here.</div>
    </div>
  </div>
  <div class="nav-shield"></div>
</div>
<div anvil-drop-default anvil-drop-redirect=".placeholder" anvil-drop-container=".anvil-container"></div>
 
<script>
  function hideSidebar() {
    var ln = $('.structure > .nav-holder > .left-nav');
    ln.animate({left: -ln.outerWidth()}, function() {
      ln.removeClass("in-transition shown").addClass("hidden");
      $('.nav-shield').removeClass("shown");
      $(window).trigger('resize');
    });
  }
  function showSidebar() {
    var ln = $('.structure > .nav-holder > .left-nav');
    $('.nav-shield').addClass("shown");
    ln.addClass("shown").removeClass("hidden").css({left: "-100%"}).css({left: -ln.outerWidth()}).animate({left: 0}, function() {
      ln.removeClass("in-transition");
    });
    $(window).trigger('resize');
  }
  $('.sidebar-toggle, .nav-shield').off('click').on('click', function() {
    var ln = $('.structure > .nav-holder > .left-nav');
    if (ln.is(":visible") || $('.nav-shield').is(".shown")) {
      hideSidebar();
    } else if(!ln.is(":empty")) {
      showSidebar();
    }
  });
  $('.left-nav').off('click').on('click', 'a, button', function() {
    if ($('.nav-shield').is(":visible")) {
      $('.nav-shield').trigger('click');
    }
  });
</script>

Here is the Pico code for main.py

import anvil.pico
import uasyncio as a
from machine import Pin

# This is an example Anvil Uplink script for the Pico W.
# See https://anvil.works/pico for more information

UPLINK_KEY = "server_PAQNMJD7IEW2DWK2EIJ6VELP-OVMIO5KF5OV3ISRP"

# We use the LED to indicate server calls and responses.
led = Pin("LED", Pin.OUT, value=1)


# Call this function from your Anvil app:
#
#    anvil.server.call('pico_fn', 42)
#
def button_1_click(self, **event_args):
    """This method is called when the button is clicked"""
    pass
    anvil.server.call('pico_fn', 18)

@anvil.pico.callable(is_async=True)
async def pico_fn(n):
    # Output will go to the Pico W serial port
    print(f"Called local function with argument: {n}")

    # Blink the LED and then double the argument and return it.
    for i in range(10):
        led.toggle()
        await a.sleep_ms(50)
    return n * 2

# Connect the Anvil Uplink. In MicroPython, this call will block forever.

anvil.pico.connect(UPLINK_KEY)


# There's lots more you can do with Anvil on your Pico W.
#
# See https://anvil.works/pico for more information